我需要了解一些事情,我有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 对象的成员,尽管它是拼图?或者甚至为什么不吹掉全球变量呢?
答案 0 :(得分:3)
这是因为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"
答案 1 :(得分: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
完全相同。