了解javascript函数、作用域和闭包

Understanding javascript functions, scope and closures

本文关键字：闭包 作用域 javascript 函数 了解      更新时间：2023-09-26

有人能详细解释一下这个js片段的作用吗？

(function (window) {
    var test = window['test'] = {};
    test.utils = new(function(){ ... })();
})(window);

我知道该函数不是全局范围的。我知道它正在创建一个名为test的变量，该变量指向window对象中的一个空对象属性。我也理解utils是测试的一个性质。

我不明白最后一部分的目的是(window);，也不明白为什么utils函数被指定为new。

请解释。

它创建一个函数并立即调用它，传入window。该函数接收一个名为window的参数，然后在其上创建一个空对象，该对象既可用作window上的属性test，也可用作局部变量test。然后，它通过new调用一个函数来创建一个对象，并将该对象分配给test.utils。

我不明白最后一部分的目的是什么（窗口）；。。。

在您引用的代码中，它并没有真正起到任何作用，因为传递到主（外部）函数window的符号与接收它的参数的名称相同。如果它们的名称不同，那么它将起到一定的作用，例如：

(function(wnd) {
})(window);

这将使window在函数中可用作wnd。

或者为什么utils函数被指定为新函数。

utils不会是一个函数（至少，除非你用...替换的代码做了一些真的奇怪的事情），它将是调用该函数创建的对象。

整个事情可以重写得更清楚：

(function(window) {
    var test;
    test = {};
    window['test'] = test;
    test.utils = new NiftyThing();
    function NiftyThing() {
    }
})(window);

这仍然毫无理由地做window的事情，但希望它能清楚地表明new(function() { ... })();比特在做什么。

首先，这是一个自调用函数。

它调用自己，将window对象作为函数输入参数，以确保在整个函数中，window具有预期的含义。

test.utils = new(function(){ ... })(); <--- This is an object constructor.

当使用new运算符调用函数时，它将变为对象构造函数。

例如：

var conztructor = function() {
   this.name = "Matias";
};
var obj = new conztructor();
alert(obj.name); // <--- This will alert "Matias"!

(window);的目的是创建一个新的变量和引用来保存JavaScript Window对象实例，避免其他库可能重用window（或任何其他）标识符，并且您自己的库可能会因此而中断。

这很好，可以避免更改其他库可能使用的全局范围标识符。

更新

作为对一些评论的回应，运行以下代码：

http://jsfiddle.net/wChh6/5/

这里发生的事情是正在声明一个新的匿名函数。(window)的最后一部分调用该函数，将window作为参数传递。

在内部，对test.utils = new(function(){ ... })();的调用创建一个新对象（其内容由传递给new的函数定义），并将其分配给test.utils。

当您定义一个具有最后一个父级的函数时，该函数在加载给定参数后自动执行，在您的情况下为window

(function (window) {
    var test = window['test'] = {};
    test.utils = new(function(){ ... })();
})(window);

JS函数定义：最后括号的含义

相关文章：