javascript module pattern from You don't know JS

javascript module pattern from You don't know JS

本文关键字：know JS don module pattern from You javascript      更新时间：2023-09-26

我已经阅读和测试下面的代码几个小时了，我只是不能掌握某些事情。我一直在使用chrome控制台基本上在我可以添加的每一行中都添加了断点并且一直在检查但我只是不确定

1)我只是不确定深度数组的目的。对我来说，第一个奇怪的事情是，为什么脚本不尝试把数据放在第一次调用它(从MyModules.define("bar",[],function()) ?为什么脚本第二次调用define(MyModules.define("foo",["bar"], function(bar))，然后添加["酒吧"]到数组时，第一次定义应该在第一时间完成?

2)此代码为modules[name] = impl.apply(impl,deps)。每次回调时，不要使用"this"..这里有必要应用吗?此外，这可能是我缺乏理解的回调时，"应用"是使用的，但如何读这个?我以为"apply"通常是这样的functionName.apply(obj,[])

在这种情况下，这是否就像是在说functionName.apply(functionName, []) ??还是因为函数本身是匿名的?

    var MyModules = (function Manager() {
        var modules = {};
        function define(name,deps,impl) {
            for ( var i=0; i<deps.length; i++) {
                deps[i] = modules[deps[i]];
            }
            modules[name] = impl.apply(impl,deps);
        }
        function get(name) {
            return modules[name];
        }
        return {
            define : define,
            get: get
        };
    })();
    MyModules.define("bar",[],function() {
        function hello(who) {
            return "Let me introduce: " + who;
        }
        return {
            hello : hello
        };
    })
    MyModules.define("foo",["bar"], function(bar) {
        var hungry = "hippo";
        function awesome() {
            console.log(bar.hello(hungry).toUpperCase() );
        }
        return {
            awesome: awesome
        };
    });
    var bar = MyModules.get("bar");
    var foo = MyModules.get("foo");
    console.log(bar.hello("hippo"));
    foo.awesome();

我只是不确定deps数组的目的。

你似乎对整个MyModules对象的目的感到困惑，不是吗?

define方法可用于声明一个模块，带有一个名称、一个依赖项数组和一个工厂函数:

  • name是模块对象在modules字典下存储的字符串
  • deps数组包含当前声明的模块所依赖的模块名。
  • 将调用impl函数来创建将在name下可用的模块对象。它确实传递了模块对象，其中deps数组中的名称被解析。

为什么脚本不尝试把数据第一次调用它(从MyModules.define("bar",[],function()) ?为什么脚本使第二次调用定义(MyModules.define("foo",["bar"], function(bar))?

这意味着声明一个名称为bar的模块，没有任何依赖关系，声明一个名称为foo的模块，依赖于bar。通常，这两个声明将放在不同的脚本中。

此代码modules[name] = impl.apply(impl,deps) -每个回调，不要使用' This '..这里有必要应用吗?

是的，这里需要apply来传递任意多个参数给函数。然而，传递impl函数作为this值确实没有任何意义，null在这里更合适。

一个更好、更容易理解的定义应该是

function define(moduleName, dependencyNames, factory) {
    var dependencies = [];
    for (var i=0; i<dependencyNames.length; i++) {
        dependencies[i] = get(dependencyNames[i]); // resolve name
    }
    modules[moduleName] = factory.apply(null, dependencies);
}
相关文章：