什么?你还不知道Symbol?

简介: ES6引入了一种新的原始数据类型`Symbol`表示独一无二的值。它是JavaScript语言的第七种数据类型,是一种类似于字符串的数据类型。

前言

ES6引入了一种新的原始数据类型Symbol表示独一无二的值。它是JavaScript语言的第七种数据类型,是一种类似于字符串的数据类型。

Symbol的特点

  • Symbol的值是唯一的,用来解决命名冲突的问题
  • Symbol值不能与其他数据进行运算
  • Symbol定义的对象属性不能使用for...in循环遍历,但是可以使用Reflect.ownKeys来获取对象的所有键名

创建Symbol的两种方式

创建Symbol

    // 创建Symbol
    let s = Symbol();
    console.log(s, typeof s); // Symbol() 'symbol'

打印出来的数据跟想象中是不是不一样?是不是觉得s应该是一个很长的东西?这是因为它的唯一性在这里是不可见的,所以我们才看不见。

不要慌,继续往下看,我们继续创建Symbol。

    let s2 = Symbol('Ned');
    let s3 = Symbol('Ned');
    console.log(s2 === s3); // false

我们现在传入了两个字符串,想看看返回的值是不是一样的,发现是不一样的。

我的理解:
虽然传入两个字符串内容一样,但是他们的编号未必一样,啊不,应该是一定不一样。

使用Symbol.for创建Symbol

这样创建的Symbol是一个对象。

     let s4 = Symbol.for('Ned');
     console.log(s4, typeof s4); // Symbol(Ned) 'symbol'

通过Symbol.for创建的,我们可以通过传入同一字符串来得到唯一的symbol值的。

    let s4 = Symbol.for('Ned');
    let s5 = Symbol.for('Ned');
    console.log(s4 === s5); // true

【强调】Symbol值不能与其他数据进行运算

    let a = Symbol();
    let b = a + 100;
    let c = a + '100';

这都是不行的,会直接在浏览器中报错。

Symbol的基本使用

symbol的使用场景就是给对象加属性或者方法
    let game = {
        name: '石头剪刀布',
        ...
        up: function() {
            console.log('这是up函数');
        },
        down: function() {
            console.log('这是down函数');
        }
        ...
    }

现在有一个对象game,我们想往里添加两个方法,分别是updown,但是我们不清楚现在对象中是否已经具有updown两个方法,按照以往的方法,我们是不是应该打开这个对象,去里面一一查找是否具有这两个方法,如果找到了,我们是不是就应该换个名字,如果没找到,我们就可以向内添加方法,但是这个对象结构简单还好,如果稍微复杂一点的话,这个操作就会非常复杂,会耗费许多时间。

在这种应用场景下,我们就应该应用Symbol来创建唯一值,完成这个需求。

    // 声明一个method对象
    let methods = {
        up: Symbol(),
        down: Symbol()
    }
    // 向game对象中,注入方法
    game[methods.up] = function(){
        console.log('我要上升!');
    }
    game[methods.down] = function(){
        console.log('我要下降!');
    }

我们使用这样的方式,给game对象添加方法,是不会破坏game原有的一些属性的,是非常安全快速的。

下面我们打印一下game对象,看一下他内部是什么样子的。

    name: "石头剪刀布"
    down: f()
    up: f()
    Symbol(): f()
    Symbol(): f()

可以看到,多出了两个Symbol函数,没有对原函数造成影响。

数据类型小诀窍

送大家一个记住JavaScript数据类型的小诀窍

共八种

USONB: you are so niu bility

U: undefined

S: string symbol

O: object

N: null number

B: boolean bigint

想顺便复习数据类型的话也可以看我的这篇文章:一文带你了解JavaScript的数据类型

最后

希望总结的这些知识可以让大家对symbol类型的数据有一个简单的了解。

相关文章
|
9月前
|
存储 算法 Java
聊聊jvm的内存结构, 以及各种结构的作用
【10月更文挑战第27天】JVM(Java虚拟机)的内存结构主要包括程序计数器、Java虚拟机栈、本地方法栈、Java堆、方法区和运行时常量池。各部分协同工作,为Java程序提供高效稳定的内存管理和运行环境,确保程序的正常执行、数据存储和资源利用。
241 10
|
弹性计算 运维 安全
所以!云服务器也可以玩转大模型啦?
原型《完蛋!我被LLM包围了! 》 是魔搭社区联合灵积平台和通义千问2.0模型推出的一款玩坏LLM的智力挑战游戏 。用户可以通过计算巢服务创建出的游戏进行免费体验。即刻体验由云服务器创建的大模型游戏!
31666 1
|
9月前
|
机器学习/深度学习 人工智能 算法
|
存储 缓存 负载均衡
JVM(Java虚拟机)详解(JVM 内存模型、堆、GC、直接内存、性能调优)
JVM(Java虚拟机)详解(JVM 内存模型、堆、GC、直接内存、性能调优)
69103 9
JVM(Java虚拟机)详解(JVM 内存模型、堆、GC、直接内存、性能调优)
|
11月前
|
分布式计算 资源调度 Hadoop
Hadoop入门基础(五):Hadoop 常用 Shell 命令一网打尽,提升你的大数据技能!
Hadoop入门基础(五):Hadoop 常用 Shell 命令一网打尽,提升你的大数据技能!
|
Python
Python报错: No module named 'lxml'
Python报错: No module named 'lxml'
503 1
联系阿里云人工客服的四种方法(加急处理)
阿里云人工客服怎么联系?可以通过人工客服24小时电话、在线转人工或钉钉移动端、提交工单、建议与投诉四种加急处理方法,阿里云百科来详细说下联系阿里云人工客服的详细操作流程:
15380 0
联系阿里云人工客服的四种方法(加急处理)
|
存储 机器学习/深度学习 自然语言处理
Python 第4章课后习题参考答案
第4章课后习题参考答案
2693 0
|
存储 设计模式 缓存
Unity面试题——Unity性能优化
Unity面试题——Unity性能优化
486 0
|
自然语言处理 索引
AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等

登录插画

登录以查看您的控制台资源

管理云资源
状态一览
快捷访问