Question

我需要了解一些事情，我有done up a plunk来帮助传达我的问题。

JavaScript的：

// "person" written as a plain object
var person = {
    showName: function () { return this.name; },
    setName: function (newName) { this.name = newName; }
};

//  room is class where nested function is a lambda
var room1 = {
    capacity: 10,
    exits: 2,
    count: 0,
    person: 'this property is a String, not an Object',
    addPerson: function (name) {
        this.count += 1;
        this.person = name;
        var nestedFunction = function (name) {
            this.person = name + ' name has been blown away';
        }(name);
    }
};

//  room is class where nested function is a method
var room2 = {
    capacity: 10,
    exits: 2,
    count: 0,
    person: 'this property is a String, not an Object',
    addPerson: function (name) {
        this.count += 1;
        this.person = name;
        function nestedFunction(name) {
            this.person = name + ' name has been blown away';
        }(name);
    }
};

HTML：

<input id="PersonObjectButton" type="submit" value="Click Me First to See Person showName Method Called"
           onclick="person.setName('Dave');alert(person.showName());" /> <br /> 
<input id="PersonObjectButtonAwry" type="submit" value="Click Me To Blow Away Global Variable" 
           onclick="room1.addPerson('Alan');alert(person);" /> <br />              
<input id="PersonObjectButtonFine" type="submit" value="Click Me to See Person showName Method Called" 
           onclick="room2.addPerson('Alan');alert(person.showName());" /> <br />

如果您运行该插件并点击顶部按钮，则会显示名称“Steve”。那里没什么难的。当您单击下面的按钮时，它会显示“Alan现在在这里。其他名称已被吹走”。我想我明白了。基本上， room1 中的嵌套函数是一个函数和NOT方法。因为它不是具有任何对象成员的方法，所以它位于全局命名空间中并且它会消除 person 变量（因此，此关键字不会保持对 room1 对象的引用。

这是我不太关注的第3个按钮。如果刷新页面并单击第3个按钮，您将看到该变量不会消除全局命名空间中的 person 变量。在这种情况下， this 关键字确实包含对 room1 对象的引用。

我的问题是，命名函数是什么，它不是作为函数表达式创建的，它使它成为 room2 对象的成员，尽管它是拼图？或者甚至为什么不吹掉全球变量呢？

Answer 1

这是因为room2中的nestedFunction定义和(name)是两个单独的语句。

var nestedFunction = function (name) {
    this.person = name + ' name has been blown away';
}(name);

此代码将创建一个函数，使用name变量调用它，然后将返回值赋给nestedFunction。

function nestedFunction(name) {
    this.person = name + ' name has been blown away';
}(name);

另一方面，此代码创建一个命名函数。该操作的返回值始终未定义，因此您无法立即调用该函数。相反，它将被视为两个单独的陈述：

function nestedFunction(name) {
    this.person = name + ' name has been blown away';
};(name);

它创建一个函数，然后计算变量！

要在Javascript控制台中演示：

function nestedFunction(name) {
     console.log("called")
}("example")
// "example"

Answer 2

在room1中，您有一个立即执行的函数表达式（也称为IIFE）。你是对的this指的是全局对象。因此

var nestedFunction = function (name) {
    this.person = name + ' name has been blown away';
}(name);

相当于

window.person = name + ' name has been blown away';

在第二种情况下，您使用函数声明。即使它看起来像，它的功能仍然是而不是。代码实际上被解释为两个语句：

function nestedFunction(name) {
    this.person = name + ' name has been blown away';
} // end of function declaration
(name); // an expression statement which doesn't do anything

与

相同

function nestedFunction(name) {
    this.person = name + ' name has been blown away';
}
name;

或只是

function nestedFunction(name) {
    this.person = name + ' name has been blown away';
}

我的问题是，有关命名函数的内容是什么，它不是作为函数表达式创建的，它使它成为room2对象的成员，尽管它是嵌套的？

没有，不成为room2的属性值。

或者甚至为什么不吹掉全局变量呢？

因为该函数永远不会执行。如果您在声明后添加nestedFunction();，则其行为与room1完全相同。

嵌套函数和吹走全局变量

2 个答案: