我正在尝试更好地理解ES6中的符号,我已经阅读了以下答案:
https://stackoverflow.com/a/22280202/5591717
它们现在被称为唯一符号,它们唯一的用途是避免属性之间的名称冲突。
名字冲突仅仅意味着一个名字遮蔽了另一个名字吗?或者它也意味着错误,其中某些东西不能被重新声明?
举个例子:
let color = Symbol('this is a color')
let apple = {
[color]: 'red'
}
console.log(apple[color]) //red
console.log(apple.color) //undefined
apple[color] = 'black'
console.log(apple[color]) //black
console.log(apple.color) //undefined
apple.color = 'white'
console.log(apple[color]) //black
console.log(apple.color) //white
看起来属性可以被遮蔽,即使它们是通过符号访问的。
它们还允许与符号名称同名的点符号属性与不同的值共存。这就是避免名称冲突的意思吗?
发布于 2019-06-19 08:54:12
这不是遮蔽:
例如
const foo = 'foo';
(() => {
// entirely separate variable which shadows outer variable with same name
const foo = 'foo2';
})();
存储符号的变量名对任何东西都没有影响(这很好-代码的执行不应该取决于使用的变量名)。
let mySymbol = Symbol('this is a mySymbol')
let apple = {
[mySymbol]: 'red'
}
console.log(apple[mySymbol]) //red
console.log(apple.color) //undefined
apple[mySymbol] = 'black'
console.log(apple[mySymbol]) //black
console.log(apple.color) //undefined
apple.color = 'white'
console.log(apple[mySymbol]) //black
console.log(apple.color) //white
代码的不同部分可能不知道彼此,但它们希望确保一个使用的属性与另一个不同。这可以由每个部分使用自己的符号来完成,这样两段代码就不可能意外地使用相同的属性名称,从而导致错误。例如:
// module1.js
const module1 = (() => {
const module1Sym = Symbol();
return (obj) => {
// put some data on obj which can be retrieved by this module later
obj[module1Sym] = 'module 1 data';
};
})();
// module2.js
const module2 = (() => {
const module2Sym = Symbol();
return (obj) => {
// put some data on obj which can be retrieved by this module later
obj[module2Sym] = 'module 2 data';
};
})();
const obj = {};
module1(obj);
module2(obj);
如果一个模块使用属性名module1data
来代替,那么可能会出现问题--如果另一个自称module1的模块试图在该对象上存储数据呢?然后,事情就会分解:
// module1Foo.js
const module1Foo = (() => {
return (obj) => {
// put some data on obj which can be retrieved by this module later
obj.module1Data = 'foo data';
};
})();
// module1Bar.js
const module1Bar = (() => {
return (obj) => {
// put some data on obj which can be retrieved by this module later
obj.module1Data = 'bar data';
};
})();
const obj = {};
module1Foo(obj);
module1Bar(obj);
// Uh oh, foo data got overwritten
console.log(obj);
上面是一个名称冲突的例子。两个模块意外地使用了相同的属性名称。
https://stackoverflow.com/questions/56658718
复制相似问题