内容简介：开发者经常互换使用术语“库”和“框架”。但是，两者是有区别的。“框架”和“库”都是某人编写的代码，用于解决常见的问题。比如，你有一个处理字符串的程序。你决定保持你代码的DRY（don't repeat yourself），然后编写像下面可复用的功能代码：
开发者经常互换使用术语“库”和“框架”。但是，两者是有区别的。
“框架”和“库”都是某人编写的代码，用于解决常见的问题。
比如，你有一个处理字符串的程序。你决定保持你代码的DRY（don't repeat yourself），然后编写像下面可复用的功能代码：
function getWords(str) {
const words = str.split(' ');
return words;
}
function createSentence(words) {
const sentence = words.join(' ');
return sentence;
}
复制代码
那么恭喜你！你创建了一个库。
框架和库没有多么神奇。库和框架都是由某人编写的可复用的代码。两个的目的都是为了帮助你更快捷地解决常见的问题。
我常常使用 房子 作为网络开发概念的比喻。
库就像去宜家家居（IKEA，一家知名的家居零售商）购物一样。你已经有了个家，但是你需要布置些家具。你不想从头制作属于自己的桌子。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是一个不那么自以为是的框架。
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持 码农网
本站部分资源来源于网络，本站转载出于传递更多信息之目的，版权归原作者或者来源机构所有，如转载稿涉及版权问题，请联系我们。
Ajax Design Patterns
Michael Mahemoff / O'Reilly Media / 2006-06-29 / USD 44.99
Ajax, or Asynchronous JavaScript and XML, exploded onto the scene in the spring of 2005 and remains the hottest story among web developers. With its rich combination of technologies, Ajax provides a s......一起来看看 《Ajax Design Patterns》 这本书的介绍吧!
