揭秘 `Symbol`：JavaScript 中独一无二的超级键

answerball
353 阅读4分钟

引言

在 JavaScript 的宇宙中，Symbol 类似于拥有独特超能力的秘密武器。它不仅确保了每个实例都是独一无二的，而且还在大型项目和团队协作中扮演着防止属性名冲突的关键角色。本文将深入探讨 Symbol 的特性、用法及其在现代编程实践中的重要性。

一、Symbol：独一无二的标识符

Symbol 是 ES6 引入的一种新的原始数据类型，它的主要特点是 唯一性。每次调用 Symbol() 函数都会返回一个全新的、独一无二的值，即使你给定相同的描述（label），也不会影响其唯一性。这使得 Symbol 成为了对象属性键的理想选择，尤其是在需要避免键名冲突的情况下。

const uniqueKey = Symbol('unique');
console.log(uniqueKey === Symbol('unique')); // false, 即使标签相同，它们也是不同的

image.png

二、Symbol 在对象字面量中的应用

当我们在对象字面量中使用 Symbol 作为键时，可以确保这些键不会被其他同名的字符串键所覆盖。这对于维护复杂对象结构非常有帮助，特别是在多人协作开发的大型项目中。

let name = "xbk";
const classMates = {
  "cy": 2,
  [name]: "mn",
  [Symbol('Mark')]: { grade: 50, gender: 'male' },
  [Symbol('Olivia')]: { grade: 80, gender: 'female' },
  [Symbol('Olivia')]: { grade: 80, gender: 'female' },  
    //即使这里出现了两个一样的label,但它不会像普通字符串属性一样被覆盖
  }
};

console.log(classMates.cy, classMates[name]); // 输出: 2 mn

在这里还有一个小知识点中括号的作用

当你执行 console.log(classMates.cy, classMates[name]); 时：

  • classMates.cy 直接访问了对象上的 "cy" 键，其值为 2。

  • classMates[name] 则是通过查找 name 变量的值（即 "xbk"），然后以此为键名去访问对象，结果找到了对应的值 "mn"。

    这个方括号就是去告诉JavaScript引擎，这里不是一个普通的字符串常量，他是需要对括号内的数据进行处理来再作为键。

三、Symbol 键的独特行为

Symbol 键有一些特殊的行为，比如它们不会出现在 Object.keys()、Object.values() 和 Object.entries() 的结果中，因为它们被设计为私有或内部使用的标识符。如果你想要访问所有的 Symbol 键，你需要使用 Object.getOwnPropertySymbols() 方法。

image.png

上述的3个api都无法获取到关于Symbol的信息，我们可以通过如下的api来获取

image.png

在拿到了Symbol属性指之后我们可以通过map这个api来获取它的value

image.png

通过这样的步骤我们成功获取到了Symbol上的value

我们在上面看到这4个api都是通过Object来调用的，很多小伙伴就会疑惑了既然c也是一个对象为什么不能直接调用？

这我们就得了解到原型这个概念了如果你想了解更多可以看看我之前的一篇文章原型与实例

这里我们粗略地看看

image.png

c只能通过原型链调用这些方法，而这其他的4个api都是子在Object的构造器上，所以无法使用！

image.png

所以只能通过Object本身来调用这些方法。

四、Symbol 的枚举性和迭代

image.png

尽管 Symbol 的 enumerable 属性默认是 True， 但是仍然不可以枚举 因为 Symbol 独特设计就是提供唯一值，只能通过Object.getOwnPropertySymbols来获取

五、为什么选择 Symbol？

  • 防止键名冲突：在一个大项目中，多个开发者可能会添加具有相同名称的属性，导致意外的覆盖。Symbol 可以有效避免这种情况。
  • 保护隐私数据：由于 Symbol 不会出现在常规遍历中，因此它们可以用来隐藏不希望暴露的数据。
  • 增强代码可维护性：对于复杂的应用程序来说，使用 Symbol 有助于提高代码的清晰度和可维护性。

六、总结

Symbol 是 JavaScript 提供给我们的强大工具之一，它为我们解决了一些传统上难以处理的问题。无论是在避免键名冲突方面，还是在保护隐私数据和增强代码可维护性方面，Symbol 都展现出了其独特的价值。随着我们对这一特性的深入了解，相信你会发现在适当的情景下运用 Symbol 能够让你的代码更加优雅和高效。

通过这篇文章，希望能够为你揭开 Symbol 的神秘面纱，并且激发你在未来的项目中大胆地尝试这种强大的新特性。记住，Symbol 不仅仅是一个简单的标识符，它是 JavaScript 生态系统中不可或缺的一部分，为开发者们提供了更多创造性的可能性。

20200229174423_bzukt.jpg

avatar
文章
阅读
粉丝