重写JavaScript库并将其添加到我的名称空间

Question

我打开了一个名为Jibberish（ https://github.com/mdp/gibberish-aes ）的JavaScript项目，并试图了解它的编码风格，我只给出了一部分的开头和结尾：

(function (root, factory) {
    if (typeof exports === 'object') {
        // Node. 
        module.exports = factory();
    } else if (typeof define === 'function' && define.amd) {
        // AMD. Register as an anonymous module.
        define(factory);
    } else {
        // Browser globals (root is window)
        root.GibberishAES = factory();
    }
}(this, function () {
    'use strict';
    var Nr = 14,
    /* Default to 256 Bit Encryption */
    Nk = 8,
    Decrypt = false,
    enc_utf8 = function(s)
    {
        try {
            return unescape(encodeURIComponent(s));
        }
        catch(e) {
            throw 'Error on UTF-8 encode';
        }
    },
    //...................................
    return {
        "size": size,
        "h2a":h2a,
        "expandKey":expandKey,
        "encryptBlock":encryptBlock,
        "decryptBlock":decryptBlock,
        "Decrypt":Decrypt,
        "s2a":s2a,
        "rawEncrypt":rawEncrypt,
        "rawDecrypt":rawDecrypt,
        "dec":dec,
        "openSSLKey":openSSLKey,
        "a2h":a2h,
        "enc":enc,
        "Hash":{"MD5":MD5},
        "Base64":Base64
    };
}));

只是了解一下它的用法：

// GibberishAES.enc(string, password)
// Defaults to 256 bit encryption
enc = GibberishAES.enc("This sentence is super secret", "ultra-strong-password");
alert(enc);
GibberishAES.dec(enc, "ultra-strong-password");

我可以看到最外层的自执行函数在代码末尾返回一个对象，该对象实际上是anonymous（！），并且该对象的成员是在自执行函数内部定义的函数，因此，属性"size"是指function size()定义为函数表达式：

size = function(newsize){...}

我什至可以回想起所有关于这种方法的私有和公共功能的讨论，方法是将所有返回的函数称为public ，其余的称为private但是有些事情让我很困惑：

1. 为什么外部匿名函数具有参数，将在哪里使用它们？

2. 而不是(function(){//put my code here...}()); 作者使用的(function(root, factory){//some code...}(this, function(){//main code here...})); ，为什么呢？

3. 关于问题（2），我可以看到this和function(){//main code here...} this两个参数作为参数传递给外部匿名函数，而不是root和factory 。 所以， root成了this ！ 但是，现在this指的是什么？

4. 也许我们可以更好地重写所有这些内容？ 我刚刚阅读了如何在JavaScript中声明名称空间？ 并且我发现Jaco Pretorius的答案是如此之好，以至于我可以重写它并将其添加到我的命名空间中，如下所示：

   （函数（myGibberishAES）{

   //这里的主要代码...

   }（window.myGibberishAES = window.myGibberishAES || {}））；

可以接受可接受的编码标准吗？

谢谢！

Answer 1

这种格式称为UMD（通用模块定义），它是一种编写可在有无AMD（异步模块定义）和有无Node。的情况下使用的代码的方法。

在第一个匿名函数中，代码将检查我们所处的环境。

1. 如果定义了exports功能，那么我们可能正在使用node.js
2. 如果有一个称为define的函数，并且具有一个名为amd的属性，则意味着我们正在使用AMD。
3. 如果以上情况均不成立，则说明我们未使用任何东西，因此应将其附加到根对象，在此特定情况下为window 。

该函数的参数是this （将是window ）和一个基本上是工厂的函数，即，实际上是定义对象的代码。 通常（没有UMD），它看起来像这样：

var myModule = (function() {
    ...
}();

因此，现在factory基本上就是该函数，它将返回您的模块/对象。 如果使用node.js，则可以将该对象分配给module.exports如果使用AMD，则可以将其传递给define函数；否则，可以将其附加到根对象（ window ）。

就您的重写问题而言，您可能不希望这样做，因为常规的JavaScript命名空间声明模式不适用于node.js和AMD。 与requireJS一起使用的AMD使您可以指定和管理依赖项，因此，如果有人在使用requireJS，这将使他们很容易地导入此模块。 这基本上是满足三个不同用例和框架的方法。

如果您未使用node.js或requireJS，则无需重写任何内容，因为GibberishAES将是连接到window的全局对象，因此您可以直接使用它。

有关更多信息，请查看GitHub上的UMD ，它具有许多模式（您正在查看的是nideAdapter.js和nideAdapter.js的简单变体的amdWeb.js ），还可以在requireJS上查看AMD 。