Javascript 为什么在这么多JS库中使用函数（全局、工厂）？

在如此多的JavaScript库中，我将

全局、工厂

视为函数的参数。
例如：

jQuery：

( function( global, factory ) {

    "use strict";

    if ( typeof module === "object" && typeof module.exports === "object" ) {
//...

Vue.js：

(function (global, factory) {
  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
  typeof define === 'function' && define.amd ? define(factory) :
  (global = global || self, global.Vue = factory());
}(this, function () { 'use strict';

  /*  */

// ...

可能还有更多的例子

---

我的问题是：

全局

和

工厂

为什么经常用作参数？它们是什么？

正如一些人在评论中提到的，真正的答案是这是UMD模块的结构。

我写这篇文章主要是为了回答这个问题，因为很难在评论中加以说明。但您可以在Vue.js示例中清楚地看到代码在做什么：

    ┌──────────────────┐       ┌──────────────────┐
    │                  ▼       ▼                  │
    │    (function (global, factory) {            │
    │                                             │
    │                                             │
    │        /* deleted for clarity */            │
    │                 ┌───────────────────────────┘
    │                 │
    │    }(this, function () { 'use strict';
    │       │
    └───────┘
             /* */

         })

所以基本上它是一个。如果为匿名函数命名，则可以更清楚地重写此构造：

// rename function () { 'use strict' ...
function Vue () { 'use strict';
    /* */
}

// rename function (global, factory) ...
function UMD (global, factory) {
    /* deleted for clarity */ 
}

UMD(this, Vue);

因此，

global

基本上是

这个

当从任何函数外部引用时，它指向全局对象（

浏览器中的窗口

，而不是在node.js中命名），而

工厂

是一个创建Vue.js对象的函数（在jQuery的情况下是jQuery）。基本上，

factory

是库的实现

此结构的编写方式不会在全局范围内创建任何不必要的变量或函数，从而避免污染全局范围，并避免变量/函数名称与其他库发生冲突

---

至于为什么它会将

这个

分配给

全局

？这是因为

window

在全局范围内是（曾经是？）一个完全不受保护的变量（这就是node.js没有给它命名的原因），任何第三方代码都可以用不同的东西覆盖或修改它。如果您想在使用未知第三方代码时使用浏览器的原始全局对象，则需要使用此

此
技巧。
为了更好地理解slebetman answare，我创建了微型库

   (function (global, factory) {            
    typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
    typeof define === 'function' && define.amd ? define(factory) :
    global.tinylib= factory();         

    } (this,function() {

// your code shoud place here
    }))

这很简单，我创建了一个库

(function (global, factory) {            
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = 
factory() :
    typeof define === 'function' && define.amd ? define(factory) :
    global.tinylib = factory();         

    } (this,function() {
 -----------------------------------------mylibrary code start------------------    
 var tinylib= (function(el) {
 var obj={}
 var myelement=el

 obj.setColor=(color)=>{
 myelement.style.color=color;
  }
    return obj;
 -----------------------------------------mylibrary code end------------------    

  })
 return tinylib;
    }))

创建的库的使用

import {tinylib} from 'tinylib'

初始化：

var lib=tinylib(document.getElementById('color')) //now we use lib variable whenever we want to invoke example showen below

用法：

lib.setColor('red')

这些特定的名称可能是某些模块绑定器的输出，但可以从“JavaScript UMD”中找到一个好的起点。这是标题您缺少一些代码来全面解释jQuery，但您可以清楚地看到
factory
是
函数（）{'use strict'；/**/…
@slebetman恐怕我不明白你想说什么。你可以在你自己的代码示例中看到，
global
是
这个
，而
工厂
是
函数（）{…
。代码声明了一个函数，出于我们的目的，让我们给它命名
foo
-
函数foo（全局，工厂）{…}
。然后它调用它
foo（this，function（）{'use strict'…
。但是它这样做时没有给它一个名称，就像我们那样，它看起来是这样：
（function（全局，工厂）{…}（this，function（）{'use strict'；…}）
。它基本上是一个IIFEThanks，这很有意义。