需要了解 Backbone 主要功能

Question

我正在尝试提前学习 JavaScript 一些人建议向 Backbone.js source code

学习

(function(factory) {

   //There are some lines of code here...

})(function(root, Backbone, _, $) {

   //Many lines of code here 

});

(function(factory)中的factory是(function(root, Backbone, _, $)中的根吗？
什么是工厂？
什么是 Backbone？
什么是_？
什么是$？

Answer 1

让我们通过命名匿名函数使其更容易一些。

(function definingFn(factory) {

   //There are some lines of code here...

})(function factoryFn(root, Backbone, _, $) {

   //Many lines of code here 

});

也可以这样写：

function definingFn(factory) {/* code here */}
function factoryFn(root, Backbone, _, $) {/* code here */}
definingFn(factoryFn);

因此，definingFn 接收 factoryFn 作为命名参数 factory。所以 factory 是 factoryFn，你传递给第一个函数的函数作为参数。

然后在 definingFn 中，正在定义您询问的其他变量：

(function(factory) {

  // Establish the root object, `window` (`self`) in the browser, or `global` on the server.
  // We use `self` instead of `window` for `WebWorker` support.
  var root = (typeof self == 'object' && self.self === self && self) ||
            (typeof global == 'object' && global.global === global && global);

  // Set up Backbone appropriately for the environment. Start with AMD.
  if (typeof define === 'function' && define.amd) {
    define(['underscore', 'jquery', 'exports'], function(_, $, exports) {
      // Export global even in AMD case in case this script is loaded with
      // others that may still expect a global Backbone.
      root.Backbone = factory(root, exports, _, $);
    });

  // Next for Node.js or CommonJS. jQuery may not be needed as a module.
  } else if (typeof exports !== 'undefined') {
    var _ = require('underscore'), $;
    try { $ = require('jquery'); } catch (e) {}
    factory(root, exports, _, $);

  // Finally, as a browser global.
  } else {
    root.Backbone = factory(root, {}, root._, (root.jQuery || root.Zepto || root.ender || root.$));
  }

})(function(root, Backbone, _, $) {
  // more code here
})

有几个条件可以检测此脚本的环境，每个条件都会调用具有特定值的 factory 函数。

让我们回顾一下 "browser" 环境：

definingFn 中的第一行定义了 root，全局对象。在浏览器环境中，库使用 self 全局对象 (read about it on MDN)。

然后提供空对象代替 Backbone 命名参数，用作 "namespace" 附加在 factoryFn.

中定义的内容

然后是 underscore 库的全局变量，它使用 _ 作为其名称。

然后是 $ 对象，它可以是 jQuery、Zepto 或 Ender，这些库之一，Backbone 用于事件委托和 XHR。

Answer 2

您正在查看 AMD module pattern，我不会花太多时间关注它。 factory是和"Many lines of code"的函数。您遇到的第一个函数在加载 Backbone 的依赖项后调用 factory - underscore.js (_) 和 jquery.js ($)。将其视为以下的依赖注入版本：

<script src="jquery.js"></script>
<script src="underscore.js"></script>
<script>
function Backbone() {
  // do stuff that depends on underscore and jquery
}
</script>

工厂是在(function(factory)，根在(function(root, Backbone, _, $)?

否，上面已回答

什么是工厂？

Backbone 库的核心内容，一旦它的依赖项被加载，它就会被初始化

什么是Backbone？

一个以 root.Backbone = factory(root, exports, _, $); 开头的空对象，其中导出被初始化为 {} 给定模块

什么是_？

underscore.js 图书馆

什么是$？

jquery 图书馆

需要了解 Backbone 主要功能

Needs to understand Backbone main function

javascript

backbone.js