Question

我试图学习高级JavaScript，有些人建议学习Backbone.js source code

(function(factory) {

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

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

   //Many lines of code here 

});

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

Answer 1

您正在查看AMD module pattern，我不会花太多时间专注于此。 factory 是＆＃34;＆＃34;多行代码＆＃34;的函数。您遇到的第一个函数在加载Backbone的依赖项 - underscore.js（factory）和jquery.js（_）后调用$。将其视为依赖注入版本：

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

工厂是（函数（工厂），根目录中的（函数（root，Backbone，_，$）？

不，上面回答

什么是工厂？

Backbone库的内容，一旦加载了依赖项就会初始化

什么是Backbone？

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

什么是_？

underscore.js库

什么是$？

jquery库

Answer 2

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

(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函数。

让我们回顾一下＆＃34;浏览器＆＃34;环境：

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

然后提供空对象代替Backbone命名参数，以用作＆＃34;命名空间＆＃34;附加factoryFn中定义的内容。

然后传递使用underscore作为其名称的_库的全局变量。

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

需要了解Backbone的主要功能

2 个答案: