Разница между фреймворками и библиотеками

внешний интерфейс внешний фреймворк

banner

Разработчики часто используют термины «библиотека» и «фреймворк» как синонимы. Однако между ними есть разница.

И «фреймворк», и «библиотека» — это код, написанный кем-то для решения общих проблем.

Скажем, например, у вас есть программа, работающая со строками. Вы решаете сохранить свой код СУХИМ (не повторяйтесь), а затем пишете многоразовый функциональный код следующим образом:

function getWords(str) {
   const words = str.split(' ');
   return words;
}
function createSentence(words) {
   const sentence = words.join(' ');
   return sentence;
}

Тогда поздравляем! Вы создали библиотеку.

Фреймворки и библиотеки не такие уж волшебные. Библиотеки и фреймворки — это повторно используемый код, написанный кем-то. Цель обоих состоит в том, чтобы помочь вам решить общие проблемы быстрее.

я часто использую房子Как метафора концепций веб-разработки.

библиотекаЭто как делать покупки в ИКЕА (известном магазине товаров для дома). У вас уже есть дом, но вам нужна мебель. Вы не хотите делать свой собственный стол с нуля. Ikea позволяет вам выбирать и покупать то, что вы хотите, в свой дом. Вы контролируете ситуацию.

с другой стороны,РамкаЭто как построить типовой дом. Что касается архитектуры и дизайна, у вас есть набор чертежей и некоторые ограниченные возможности. В конечном счете, все контролируют подрядчики и чертежи. Затем они скажут вам, когда и где вы можете высказать свое мнение.

Различия в технологиях

Техническая разница между фреймворками и библиотеками заключается в控制反转срок.

当你使用库的时候，你负责应用程序的流程。此时，你正在选择何时何地调用库。当你使用框架的时候，框架负责流程。此时，框架提供了一些插入代码的地方，但是它会根据需要去调用你插入的代码。

Давайте рассмотрим пример с использованием jQuery (библиотека) и Vue.js (фреймворк).

Представьте, что мы хотим отображать сообщение об ошибке при возникновении ошибки. В нашем примере мы нажмем кнопку, чтобы вызвать и отобразить ошибку (сообщение).

Используйте jQuery

// index.html

<html>
   <head>
      <script src="https://code.jquery.com/jquery-3.3.1.min.js"
      </script>
      <script src="./app.js"></script>
   </head>
   <body>
      <div id="app">
         <button id="myButton">Submit</button>
       </div>
   </body>
</html>

// app.js

// A bunch of our own code, 
// followed by calling the jQuery library

let error = false;
const errorMessage = 'An Error Occurred';
$('#myButton').on('click', () => {
  error = true; // pretend some error occurs and set error = true
  if (error) {
    $('#app')
       .append(`<p id="error">${errorMessage}</p>`);
  } else {
    $('#error').remove();
  }
});

Обратите внимание, как мы используем jQuery. Мы говорим нашей программе, что хотим ее вызвать. Это похоже на то, что мы идем в физическую библиотеку и достаем книги, которые нам нужны, с полок.

Это не означает, что функции jQuery не требуют некоторого ввода, когда мы их вызываем, но сама jQuery является библиотекой для этих функций. Мы несем ответственность (звоните).

Использование Vue.js

// index.html

<html>
   <head>
      <script src="https://cdn.jsdelivr.net/npm/vue"></script>
      <script src="./app.js"></script>
   </head>
   <body>
      <div id="app"></div>
   </body>
</html>

// app.js

const vm = new Vue({
  template: `<div id="vue-example">
               <button @click="checkForErrors">Submit</button>
               <p v-if="error">{{ errorMessage }}</p>
             </div>`,
  el: '#vue-example',
  data: {
    error: null,
    errorMessage: 'An Error Occurred',
  },
  methods: {
    checkForErrors()  {
      this.error = !this.error;
    },
  },
});

С vue мы должны заполнить пробелы. Конструктор Vue — это объект с некоторыми специфическими свойствами. Он говорит нам, что ему нужно, а затем за кулисами Vue решает, когда ему это нужно. Vue инвертирует управление программой. Подключаем код в Vue. Vue заботится о (вызове).

Разница между библиотекой и фреймворком заключается в том, существует ли инверсия управления.

Заметка о самодовольстве

Вы часто будете слышать, что фреймворки и библиотеки описываются как «самоуверенные» или «неосведомленные». Эти термины субъективны. Они пытаются определить степени свободы разработчиков при конструировании.

Фреймворки более самоуверенны, потому что — по определению —控制反转Уступки свободы дизайна приложений требуются.

Так же, в какой-то мере, в какой-то мере субъективная точка зрения субъективна. Например, лично я считаю, что Angular — самоуверенный фреймворк, а Vue.js — менее самоуверенный фреймворк.

Суммировать

  • Фреймворки и библиотеки — это код, написанный кем-то, чтобы помочь вам выполнять общие задачи более лаконичным способом.

  • Фреймворк инвертирует управление программой. Он сообщает разработчикам, что им нужно. В библиотеках такого нет. Программисты вызывают библиотеки, где и когда они нужны.

  • Степень свободы, которую библиотека или фреймворк оставляет разработчику, будет определять, насколько он «уверен».

Спасибо за прочтение!

оригинал:medium.free code camp.org/ ему и -differ E...

мнение здесь переведено как «самостоятельно праведно» и, если неправильно, также указал, что Ван

Статья впервые опубликована:GitHub.com/still99/блог…

больше контента:GitHub.com/still99/блог…[Я все прочитал, кстати, поставьте звезду этому складу :kisting_heart:]

Категории