javascript中symbol究竟是什么?

在JavaScript中,Symbol 是一种原始数据类型,它可以用来表示独一无二的值。

基本语法

复制代码
    let a = Symbol();
    console.log(a);//Symbol()
    let b = Symbol('b');//可传入字符串用于描述Symbol,方便在控制台分辨Symbol
    console.log(b);//Symbol(b)

需要强调一点是即使传入的参数相同Symbol也是不相等的,因为其作用仅仅是用来描述。

复制代码
    let aaa = Symbol("测试");
    let bbb = Symbol("测试");
    console.log(aaa == bbb); //false

如果要获取描述可以使用description

复制代码
let aaa = Symbol("测试");
console.log(aaa.description);

Symbol.for

Symbol.for它的作用是在运行时的 symbol 注册表中搜索给定的 symbol。如果找到了,则返回相同的 symbol,否则,它会在全局 symbol 注册表中创建一个具有相同名称的新 symbol,并返回它。

与 Symbol() 不同,Symbol.for() 不一定在每次调用时都创建新的 symbol,而是首先检查给定 key 的 symbol 是否已经存在于注册表中。如果存在,则返回该 symbol。如果没有找到具有给定 key 的 symbol,Symbol.for() 将创建一个新的全局 symbol。

复制代码
let aaa = Symbol.for('lili');
let bbb = Symbol.for('lili');
console.log(aaa == bbb  );//true

Symbol.keyFor

Symbol.keyFor它用于从全局 symbol 注册表中检索与给定 symbol 共享的 key。

如果在全局 symbol 注册表中找到了与给定 symbol 相关联的 key,则返回该 key。如果没有找到,则返回 undefined。

复制代码
var global = Symbol.for("foo"); // 创建一个新的全局 symbol
console.log(Symbol.keyFor(global)); // "foo"

var local = Symbol();
console.log(Symbol.keyFor(local)); // undefined

在这个例子中,Symbol.for("foo") 创建了一个新的全局 symbol,并且 Symbol.keyFor(global) 返回了 "foo",因为 "foo" 是在全局 symbol 注册表中与 global 关联的 key。然而,对于本地 symbol local Symbol.keyFor() 返回了 undefined,因为它不在全局 symbol 注册表中。

Symbol.key和普通的Symbol分别应用在哪里?

Symbol():每次调用 Symbol() 都会返回一个全新且唯一的 Symbol 值,即使你传入相同的参数。这种特性使得 Symbol() 非常适合用于创建对象的私有属性,因为你无需担心属性名的冲突。

复制代码
let s1 = Symbol('key');
let s2 = Symbol('key');

console.log(s1 === s2);  // 输出:false

Symbol.for():Symbol.for() 会首先在全局 Symbol 注册表中查找是否存在一个键名与参数相同的 Symbol 值。如果存在,则返回该 Symbol 值;如果不存在,则创建一个新的 Symbol 值并注册到全局 Symbol 注册表中。因此,Symbol.for() 可以用于跨作用域共享 Symbol 值。

存在于全局 Symbol 注册表中的优势主要体现在以下两点:

跨作用域共享:全局 Symbol 注册表是全局的,这意味着在任何地方都可以访问到注册表中的 Symbol 值,从而实现跨作用域共享 Symbol 值。

防止命名冲突:由于 Symbol.for() 在创建 Symbol 值之前会检查全局注册表,因此可以确保相同键名的 Symbol 值是相同的,避免了命名冲突的问题。

需要注意的问题

在对象中使用Symbol需要注意使用\[\]形式,否则会被当成字符串

比如这样:

复制代码
let aaa = Symbol("小米汽车");
let obj = {
  aaa: "mi.com"
};
console.log(obj);//{aaa: 'mi.com'}

正确写法应该是:

复制代码
let aaa = Symbol("小米汽车");
let obj = {
  [aaa]: "mi.com"
};
console.log(obj);//{Symbol(小米汽车): 'mi.com'}

前端的世界总是在不断变化,作为开发者,我们需要保持好奇心和学习热情,不断探索新的技术,只有这样,我们才能在这个快速发展的时代中立于不败之地。javascript中symbol就是这样一个值得我们深入探索的领域,让我们拭目以待,它将给前端世界带来怎样的变革。

介绍一款程序员都应该知道的软件JNPF快速开发平台,很多人都尝试用过它,它是功能的集大成者,任何信息化系统都可以基于它开发出来。

这是一个基于 Java Boot/.Net Core 构建的简单、跨平台快速开发框架。前后端封装了上千个常用类,方便扩展;集成了代码生成器,支持前后端业务代码生成,实现快速开发,提升工作效率;框架集成了表单、报表、图表、大屏等各种常用的 Demo 方便直接使用;后端框架支持 Vue2、Vue3。如果你有闲暇时间,可以做个知识拓展。

相关推荐
大模型码小白6 分钟前
数据可视化:AI 生成 HTML5 动态交互式数据图表
前端·数据库·人工智能·深度学习·机器学习·信息可视化·html5
八荒启·交互动画6 分钟前
Web特效01—什么是渲染
前端·javascript·网页特效·八荒启-交互动画
wuyk5558 分钟前
从零吃透 MQTT 通信|第 10 章 阿里云 / 腾讯云 MQTT 设备完整对接实战,三元组、签名、设备上云调试
c语言·开发语言·stm32·学习·阿里云·云计算·腾讯云
小肥君10 分钟前
前端测试websocket
前端·websocket·状态模式
ocean210330 分钟前
2025-2026年Java语言及生态面试高频知识点洞察
java·开发语言·面试
南京兴帝文化传媒有限公司31 分钟前
基于地图平台的本地商户信息优化:药店夜间服务标注与客户转化实操
前端·javascript·数据库·人工智能·geo 优化·geo优化避坑·ai搜索获客
八荒启·交互动画32 分钟前
Web特效04——GPUvs CPU,为什么图形计算要交给GPU,什么是“并行计算”
前端
2302_11137 分钟前
java时间类型
java·开发语言
小七在进步1 小时前
类和对象(三)
java·开发语言