javascript - 使用变量“名称”不适用于 JS 对象

Question

可以在这个小片段中看到该行为（将其作为全局脚本执行）：

var name = {};
name.FirstName = 'Tom';
alert(name.FirstName);

警报undefined在 Chrome 中产生，但在 IE 和 Firefox 中有效。当我这样做时，我也会得到一个奇怪的价值

alert(name);

Answer 1

window.name有一个特殊用途，应该是一个字符串。Chrome 似乎将其显式转换为字符串，因此var name = {};实际上最终给全局变量（name即. 由于它是一个原始类型，因此属性 ( ) 不会“粘住”。window.name"[object Object]"name.FirstName

要解决此问题，请不要将name其用作全局变量。

Answer 2

您的name变量实际上是window.name，因为用声明的顶级变量var附加到全局对象。

HTML5 规范要求它window.name是一个DOMString. 这意味着 的值window.name只能是字符序列，不能是对象。

在 Chrome 中，尝试使用window.name存储原始字符串以外的任何内容都会将值强制转换为原始字符串。例如：

window.name = {};
window.name === "[object Object]"; // true

name您可以通过使用不在顶级范围内的变量来避免此问题：

(function() {
    var name = {};
    // this `name` is not `window.name`
    // because we're not in the top-level scope

    console.log(name);
})();

Answer 3

使用 ES6+，您可以将代码编写为let name或const name. 这不会分配它或尝试覆盖window.name. 更多关于这里。

let name = {};
name.FirstName = 'Tom';
alert(name.FirstName);

Answer 4

window.name用于设置窗口的名称，由于窗口名称只能是字符串，因此您设置的任何内容window.name都会转换为字符串。字符串，作为原始值，不能有属性。解决方案是使用不同的变量名或不同的范围。

或者，window.name如果您首先拥有此代码，则可以随意使用。我根本不推荐这个，但是，作为一个概念证明：

(function () {
    var _name;
    window.__defineGetter__('name', function () {
        return _name;
    });
    window.__defineSetter__('name', function (v) {
        _name = v;
    });
})();

此外，您应该使用{}. new Object除了更简洁之外，它还更高效、更明确。