javascript - 隐式全局 "item"变量 - Internet Explorer 和 FireFox 之间的差异

Question

只是出于好奇..

我有这个 JS 代码:

var someExternalArray = [{id: 1, name: 'a'}, {id: 2, name: 'b'}, {id: 3, name: 'c'}];
var newArray = []

//var item;
for (var i = 0; i < someExternalArray.length; i++){
    item = new Object();
    item.id = someExternalArray[i].id;
    item.name = someExternalArray[i].name;
    newArray.push(item);
}

alert('0:' + newArray[0].name + ',1:' + newArray[1].name + ',2:' + newArray[2].name);

请注意带注释的 var item，它使循环带有隐式声明的 item 变量。

• 如果我在 FireFox 上运行此代码，警报的结果是:0:a,1:b,2:c

• 如果我在 Internet Explorer 中运行相同的代码，结果是:0:c,1:c,2:c

这是 jsfiddle: https://jsfiddle.net/fvu9gb26/

当然，当我取消注释 var item 时，它在每个浏览器中的工作方式都是相同的。

有谁知道为什么会出现这种差异？谢谢。

Answer 1

基本上，这是因为 Internet Explorer 的 window 对象公开了 item()您的脚本无法覆盖的方法。

行中:

item = new Object();

item 未在本地范围内声明，因此它被解释为全局对象 (window.item) 的属性。在 Firefox 上，window 不会公开名为 item 的成员，因此引入了一个新成员，并将 new Object() 的结果分配给它。

另一方面，Internet Explorer 公开了一个名为 window.item() 的 native 方法。该成员不可写，因此无法进行赋值——它会被默默地忽略。换句话说，item = new Object() 根本没有任何效果(嗯，它确实创建了一个对象，但之后无法分配它)。

随后对 id 和 name 的赋值最终会创建 item() 方法的新成员。这些始终是同一方法的相同成员，因此它们的值在每次循环迭代时都会被覆盖。此外，每次迭代时都会将同一对象(item() 方法)推送到数组中。

因此，数组最终包含同一个对象的三次，并且其 id 和 name 成员的值是最后分配给它们的值(在最后一个值中)迭代)，分别为 3 和 'c'。