一、开篇：认识 Symbol 这个“神秘人”
在 JavaScript 的奇妙世界里，Symbol 就像是一位神秘的幕后英雄。要是把 JavaScript 对象比作一座繁华的城市，那属性名就是城市里的街道名称，大家都得按名字找到对应的地方。但在大型项目或者多人协作的代码“都市”中，人多手杂，很容易就出现同名的街道，这下可就乱套啦！这时候，Symbol 登场，它能生成独一无二的“街道名”，彻底解决属性名冲突这个大麻烦，确保每段代码都能精准定位到自己想去的地方，稳稳地提升代码的可靠性。今天，咱们就一起揭开 Symbol 的神秘面纱，深入瞧瞧它在 JavaScript 编程里的神奇作用。
二、Symbol 初印象：独一无二的值
Symbol 是 ES6 引入的一种特殊基本数据类型，它就像一把神奇的钥匙，能开启 JavaScript 里独一无二的值的大门。用 Symbol() 函数就能创建一个 Symbol 实例，每个实例都是唯一的，哪怕你给它们相同的描述，也绝不“撞衫”。比如说，咱们创建两个 Symbol：
const sym1 = Symbol('description');
const sym2 = Symbol('description');
console.log(sym1 === sym2); // false
在对象的世界里，普通属性名通常是字符串，这就容易出现“重名危机”。但 Symbol 作为属性名时，那可就稳如泰山了。像下面这个例子：
const uniqueProp = Symbol('myUniqueProperty');
const myObject = {
name: 'John',
[uniqueProp]: 'This is unique!'
};
console.log(myObject[uniqueProp]); // 'This is unique!'
这里，uniqueProp 作为对象 myObject 的属性名，确保了不会和其他同名属性冲突，稳稳守护住数据的独立性。
三、实战场景：Symbol 大显身手
（一）对象属性的“保镖”
在大型项目或者多人协作开发的代码库里，对象那可是相当复杂，属性众多。要是不小心用了相同的字符串作为属性名，就可能出现意想不到的覆盖问题。但有了 Symbol 就不一样啦，它就像给对象属性请了个“保镖”。
想象一下，在一个电商系统里，不同的模块都要给商品对象添加一些元数据。要是用普通字符串，很容易冲突：
// ES5 容易出现同名属性覆盖
const product = {
name: 'iPhone',
price: 7999
};
const otherModule = {
name: 'Some Meta',
// 这里无意间覆盖了 product 的 name 属性
product: product
};
console.log(otherModule.product.name); // 'Some Meta'，出错了！
// 用 Symbol 解决
const uniqueMeta = Symbol('productMeta');
const productWithSymbol = {
name: 'iPhone',
price: 7999,
[uniqueMeta]: 'This is unique meta data'
};
const otherModuleSafe = {
[uniqueMeta]: 'Safe Meta',
product: productWithSymbol
};
console.log(otherModuleSafe.product[uniqueMeta]); // 'This is unique meta data'，数据完好无损
通过 Symbol，每个模块都能安心地添加专属属性，不用担心干扰到其他模块的数据，稳稳保障代码的健壮性。
（二）模拟类的“隐私卫士”
在 JavaScript 的类里，要是想藏点“小秘密”，让外部代码没法轻易访问某些属性或者方法，Symbol 就能派上大用场。虽说 JavaScript 没有像其他编程语言那样严格的私有访问修饰符，但 Symbol 可以模拟出类似的效果。
const passwordSymbol = Symbol('password');
class User {
constructor(username, password) {
this.username = username;
this[passwordSymbol] = password;
}
checkPassword(inputPassword) {
return this[passwordSymbol] === inputPassword;
}
}
const user = new User('John Doe', 'secret123');
console.log(user.username); // 'John Doe'，公开属性正常访问
// 下面这行代码会输出 undefined，因为外部无法直接访问 passwordSymbol 这个属性
console.log(user[passwordSymbol]);
console.log(user.checkPassword('secret123')); // true，通过内部方法验证密码
这里，passwordSymbol 作为类里的“隐私卫士”，把密码属性保护得严严实实，外部代码很难窥探到密码的真面目，大大增强了数据的安全性。
（三）迭代器的“魔法钥匙”
当咱们想用 for...of 循环去遍历一些自定义对象时，要是没有 Symbol，那可就寸步难行啦。Symbol.iterator 就是那把开启对象可迭代功能的“魔法钥匙”。
比如说，咱们要创建一个简单的自定义可迭代对象，用来生成斐波那契数列的前几项：
const fibonacci = {
[Symbol.iterator]() {
let a = 0, b = 1, n = 0;
return {
next() {
if (n === 0) {
n++;
return { value: a, done: false };
} else if (n === 1) {
n++;
return { value: b, done: false };
}
const nextValue = a + b;
a = b;
b = nextValue;
return { value: nextValue, done: false };
}
};
}
};
for (const num of fibonacci) {
console.log(num);
if (num > 100) break;
}
在这个例子里，通过给 fibonacci 对象定义 Symbol.iterator 方法，咱们就赋予了它可迭代的能力，让 for...of 循环可以像遍历数组一样轻松遍历它，是不是超级神奇？这在处理各种自定义数据结构时特别有用，能让代码更加简洁、优雅。
四、进阶技巧：Symbol 的全局共享与隐藏属性
（一）全局共享的“秘密基地”
有时候，咱们在不同的模块或者代码片段里，需要用到同一个 Symbol 值，这时候 Symbol.for() 和 Symbol.keyFor() 就派上用场啦。Symbol.for() 就像是一个“秘密基地”管理员，它会根据给定的键，去全局的 Symbol 注册表中查找对应的 Symbol，如果找到了，就直接把这个 Symbol 拿出来给你用；要是没找到，它就新建一个 Symbol，并登记到注册表中，方便后续查找。
咱们来看个例子：
const globalSymbol = Symbol.for('myGlobalSymbol');
const anotherGlobalSymbol = Symbol.for('myGlobalSymbol');
console.log(globalSymbol === anotherGlobalSymbol); // true
在这个例子里，两次调用 Symbol.for('myGlobalSymbol') 都返回了同一个 Symbol 实例，这就实现了跨模块的全局共享。而 Symbol.keyFor() 呢，就像是一个“密码查询器”，你给它一个 Symbol，它能帮你查出这个 Symbol 在注册表中的键名，方便咱们追踪和管理这些全局 Symbol。
相比之下，普通的 Symbol() 函数每次都会创建一个全新的、独一无二的 Symbol，不会去管全局注册表的事儿。所以，要是你需要在不同地方共享同一个 Symbol，那就得用 Symbol.for() 这个“秘密武器”啦，像是在多模块的大型项目里进行跨模块通信，或者在全局配置对象里共享一些关键标识，它都能大展身手。
（二）隐藏属性的“捉迷藏”
Symbol 还有一个超酷的特性，就是它作为对象属性时，特别擅长“捉迷藏”。咱们常用的遍历方法，像 for...in、Object.keys() 还有 Object.getOwnPropertyNames()，根本发现不了它的踪迹，就算是用 JSON.stringify() 把对象转成 JSON 字符串，Symbol 属性也不会现身。这就好比给对象的某些属性穿上了“隐形衣”，让它们安安静静地待在角落里，不被外界轻易打扰。
比如说：
const secretSymbol = Symbol('mySecret');
const mySecretObject = {
publicProp: 'This is public',
[secretSymbol]: 'This is super secret!'
};
for (let key in mySecretObject) {
console.log(key); // 只会输出 'publicProp'，找不到 secretSymbol
}
console.log(Object.keys(mySecretObject)); // ['publicProp']，同样没有 secretSymbol
console.log(JSON.stringify(mySecretObject)); // {"publicProp":"This is public"}，秘密属性被完美隐藏
那要是咱们自己想找到这些藏起来的 Symbol 属性怎么办呢？JavaScript 给咱们准备了 Object.getOwnPropertySymbols() 这个“寻宝工具”，它能返回一个数组，里面装着对象所有的 Symbol 属性名，让咱们把藏起来的宝贝都找出来。
const symbolsArray = Object.getOwnPropertySymbols(mySecretObject);
console.log(symbolsArray); // [Symbol('mySecret')]
console.log(mySecretObject[symbolsArray[0]]); // 'This is super secret!'，成功获取隐藏属性的值
这种隐藏属性的特性，在咱们需要保护对象内部的敏感信息，或者不想让某些属性被常规操作干扰的时候，简直太有用了，就像给代码加了一道坚固的安全锁。
五、总结：Symbol 的超能力回顾
咱们这一趟 JavaScript 的 Symbol 探索之旅，可真是收获满满！Symbol 就像一个拥有超能力的多面手，在代码的世界里大显神通。它用独一无二的值，帮咱们给对象属性披上“防撞衣”，彻底告别属性冲突的烦恼；还能模拟私有成员，像给数据加上了“保险箱”，让外部代码无从下手，安全得很；凭借 Symbol.iterator 这个“魔法棒”，赋予对象迭代超能力，不管是自定义数据结构，还是复杂的集合，都能轻松遍历；利用 Symbol.for() 和 Symbol.keyFor() 搭建起的“全球通”桥梁，让不同模块能共享 Symbol，实现无缝对接；最后，它的隐藏属性特性，又好似给敏感信息穿上“隐身衣”，常规操作发现不了，只有通过专属的“寻宝工具”才能找到。掌握了 Symbol，就等于握住了一把提升 JavaScript 代码质量和安全性的金钥匙。大家赶紧在自己的项目里试试 Symbol 的神奇力量吧，相信它会给你带来意想不到的惊喜，让你的代码更加健壮、优雅！
作者：再学一点就睡
链接：https://juejin.cn