时间戳

首页 > 解决方案 > JavaScript - 计算属性 - 深深的困惑

javascript - JavaScript - 计算属性 - 深深的困惑

问题描述

似乎我对 JavaScript 中的计算属性感到很困惑。

当我定义一个对象并将[d]其作为键（作为属性键/名称）时，这[d]实际上是做什么的？似乎对于某些值d，它会计算s = d.toString()并将该值s用作属性键。但是对于其他值d（例如 whend是一个符号），它实际上使用符号的值作为键。

[d]因此（作为语法结构）的这种双重行为似乎令人困惑。有人可以深入解释这是如何工作的吗？

顺便说一句，还有其他特殊情况吗？或者只是d当我们有这种特殊行为时才出现符号？

回到基础：什么东西可以是对象属性的键/名称？它只是字符串还是字符串和符号，或者还有其他一些东西......？

例子：

var symbol = Symbol("test");

function Animal(name){
	this.name = name;
}

Animal.prototype = {};
Animal.prototype.constructor = Animal;

function Dog(breed){
    this.breed = breed;
    this.name = "Dog";
    this.s = symbol;
}

Dog.prototype = new Animal();
Dog.prototype.constructor = Dog;

console.log("001");
var d = new Dog("Sharo");
for (let x in d){
    console.log(x, ":", d[x]);
}

console.log("002");
d = new Object();
for (let x in d){
    console.log(x, ":", d[x]);
}

console.log("003");
d = new Number(5);
for (let x in d){
    console.log(x, ":", d[x]);
}

var d1 = {};
var d2 = {};

var d = new Dog("Sharo");

var m = {[d1] : 5, [d2] : 10, [d] : 20, z : 100, symbol: 2000, [symbol] : 5000};

console.log("============================");
console.log(m);

for (let x in m){
    console.log(x, ":", m[x]);
}
console.log("============================");

标签： javascriptecmascript-6computed-properties

解决方案

由于似乎没有人有兴趣回答这个问题，我将根据我上面得到的评论自己回答，因此我不再感到困惑。

请注意，这里的答案是基于ES6的。我的意思是……谁知道 JavaScript 的未来还会有什么 :)

当我定义一个对象并将[d]其作为键（作为属性键/名称）时，这[d]实际上是做什么的？似乎对于某些对象d，它计算s = d.toString()并使用该值s作为属性键。但是对于其他对象d（例如什么时候d是符号），它实际上使用符号的值作为键。

对，那是正确的。当 d 是 Symbol 时，直接使用它的值。当 d 不是 Symbol 时，它的值被强制转换为字符串，并且该字符串用作属性名称/键。强制更像String(d)而不是d.toString().

[d]因此（作为语法结构）的这种双重行为似乎令人困惑。有人可以深入解释这是如何工作的吗？

上面已经解释过了。

顺便说一句，还有其他特殊情况吗？或者只是d当我们有这种特殊行为时才出现符号？

没有其他“特殊情况”。从 ES6 开始，只有字符串和符号可以作为属性键。

回到基础：什么东西可以是对象属性的键/名称？它只是字符串还是字符串和符号，或者还有其他一些东西......？

如前所述，从 ES6 开始，只有字符串和符号可以作为属性键。

参考：

(1) https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors

“属性名称是字符串或符号。任何其他值，包括数字，都被强制转换为字符串。”

(2) https://www.ecma-international.org/ecma-262/6.0/#sec-topropertykey

推荐阅读