ES6 Symbol 数据结构

1. Symbol概念以及引入原因

ES6 引入了的一种新的原始数据类型Symbol,表示独一无二的值。它是 JavaScript 语言的第七种数据类型,前六种是:undefined、null、布尔值(Boolean)、字符串(String)、数值(Number)、对象(Object)。

重点

  • Symbol作用:保证每个对象属性的名字都是独一无二的
  • Symbol 可以接收字符串作为参数
  • Symbol参数(参数为对象会调用toString()作为key;参数相同值也不同;没有参数值也不同)
  • Symbol 值不能与其他类型的值进行运算,会报错。
  • Symbol 值可以显式转为字符串和布尔值,不能转为Number数值。
  • Symbol.iterator属性是一种特殊的key。指向该对象的默认遍历器方法,凡是具有Symbol.iterator属性的对象,都可以使用for...of进行遍历

2.Symbol作用:保证每个对象属性的名字都是独一无二的

问题:对象直接设置key为对象,会将对象调用toString()方法转为[Object,Object],第二个值就覆盖第一个值了

        let obj1 = {a:1}let obj2 = {a:2}let obj = {};// 想要将obj的key设置为obj1的值obj[{a:1}] = 1obj[obj1] = 1;obj[obj2] = 2;// 发现只有一个值,且返回的obj键转成了[object Object],值为2,1被覆盖console.log(obj);// [object Object] 2 

使用Symbol进行定义后,发现就不会被覆盖: 

        let obj1 = Symbol({a:1})let obj2 = Symbol({a:2})let obj = {};obj[obj1] = 1;obj[obj2] = 2;console.log(obj);

3.Symbol 可以接收字符串作为参数

Symbol函数可以接受一个字符串作为参数,表示对 Symbol 实例的描述,主要是为了在控制台显示,或者转为字符串时,比较容易区分。

如下:即使字符串相同,s1和s2也不是一个

        let s1 = Symbol('foo');let s2 = Symbol('foo');console.log(s1 === s2); //false

 3.Symbol参数(参数为对象会调用toString()作为key;参数相同值也不同;没有参数值也不同)

注意1: Symbol 的参数是一个对象,就会调用该对象的toString方法,将其转为字符串,然后才生成一个 Symbol 值。

注意2:Symbol函数的参数只是表示对当前 Symbol 值的描述,因此相同参数的Symbol函数的返回值是不相等的。

注意3:Symbol函数的参数没有值也不同

        // 没有参数的情况let s1 = Symbol();let s2 = Symbol();s1 === s2 // false// 有参数的情况let s1 = Symbol('foo');let s2 = Symbol('foo');s1 === s2 // false

4.Symbol 值不能与其他类型的值进行运算,会报错。

        let sym = Symbol('My symbol');console.log( "your symbol is " + sym);//Uncaught TypeError: Cannot convert a Symbol value to a stringlet num = Symbol(1);console.log(num+1);Uncaught TypeError: Cannot convert a Symbol value to a string

5.Symbol 值可以显式转为字符串。

        let sym = Symbol('My symbol');console.log(String(sym));//Symbol(My symbol)console.log(sym.toString());//Symbol(My symbol)

6.Symbol 值也可以转为布尔值,但是不能转为数值。

        let sym2 = Symbol();console.log(Boolean(sym2));//trueconsole.log(!sym2);//falseconsole.log(Number(sym2));//Uncaught TypeError: Cannot convert a Symbol value to a number

7.Symbol.iterator属性

  • 可以看作一种特殊的key
  • 对象的Symbol.iterator属性,指向该对象的默认遍历器方法。
  • 对象进行for...of循环时,会调用Symbol.iterator方法,返回该对象的默认遍历器。 
  • 凡是具有Symbol.iterator属性的对象,都可以使用for...of进行遍历
  • 如果想让其可以通过for...of进行遍历,就使用Symbol.iterator给其添加一个可遍历的属性

8. Symbol中Object.getOwnPropertySymbols方法获取指定对象的所有 Symbol 属性名。

  • Symbol类型时不可枚举的,即属性上有Symbol时,遍历不出来;如果想要获取上面的Symbol属性,就需要使用Object.getOwnPropertySymbols方法。
  • Object.getOwnPropertySymbols方法,可以获取指定对象的所有 Symbol 属性名。
  • Object.getOwnPropertySymbols方法返回一个数组,成员是当前对象的所有用作属性名的 Symbol 值。
        const obj = {};let a = Symbol('a');let b = Symbol('b');obj[a] = 'Hello';obj[b] = 'World';const objectSymbols = Object.getOwnPropertySymbols(obj);console.log(objectSymbols); //[Symbol(a), Symbol(b)

9.Symbol的实际使用:私有属性;常量枚举

9.1作为常量进行枚举

常量枚举 js没有枚举类型的

        // 常量枚举 js没有枚举类型的// 产生一个问题 1 2 不能重复  重复的话判断就会出错// symbol 哪怕你写重复了也没问题// const CODE_ONE = 1;// const CODE_TWO = 2;const CODE_ONE = Symbol(1)const CODE_TWO = Symbol(2)console.log(CODE_ONE === CODE_TWO);

9.2作为私有属性:对象进行遍历时,不会遍历具有Symbol类型的数据

对象进行遍历时,不会遍历具有Symbol类型的数据

        // 私有属性let private = Symbol('private')var obj = {_name: '张三',[private]: '私有的属性',say: function () {console.log(this[private])}}console.log(Object.keys(obj))//['_name', 'say']

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/139639.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

ACU-01B 3HNA024871-001/03 机器人将如何改变世界

ACU-01B 3HNA024871-001/03 机器人将如何改变世界 由于改进的传感器技术以及机器学习和人工智能方面更显著的进步,机器人将继续从单纯的机械机器转变为具有认知功能的合作者。这些进步,以及其他相关领域,正在享受一个上升的轨迹,…

计算机缺失pasmutility.dll怎么办,三步解决pasmutility.dll缺失

pasmutility.dll文件是windows系统中重要的dll文件,电脑一旦缺失dll文件就会导致电脑无法正常运行,同时还会唐初电脑缺失pasmutility.dll文件的提示窗口,非常影响电脑运行,那么出现计算机缺失pasmutility.dll该怎么办呢&#xff1…

【硬件+软件】示波器的自动化控制

有没有这样一种情况,就是通过脚本控制你的测量设备,比如示波器,那是不是就可以不用人为的去分析数据,直接由脚本就可以完成整个操作了。 是的,有这样一种方式就可以,就是利用python中的pyvisa库&#xff0c…

Qt系列-常用控件使用整理

1、QMainWindow介绍 菜单栏最多只有一个 //菜单栏创建 菜单栏最多只能有一个QMenuBar*bar menuBar();//将菜单栏放入到窗口中setMenuBar(bar);//创键菜单QMenu*fileMenubar->addMenu("文件");QMenu*editMenubar->addMenu("编辑");//创建菜单项QActi…

牛客网 -- WY28 跳石板

题目链接&#xff1a; 跳石板_牛客题霸_牛客网 (nowcoder.com) 解题步骤&#xff1a; 参考代码&#xff1a; void get_approximate(vector<int>& v,int n) {//求约数&#xff0c;从2到sqrt(n)即可&#xff0c;原因看图解//这里一定要等于sqrt(n)&#xff0c;例如16…

【网络编程】从网络编程、TCP/IP开始到BIO、NIO入门知识(未完待续...)

目录 前言前置知识一、计算机网络体系结构二、TCP/IP协议族2.1 简介*2.2 TCP/IP网络传输中的数据2.3 地址和端口号2.4 小总结 三、TCP/UDP特性3.1 TCP特性TCP 3次握手TCP 4次挥手TCP头部结构体 3.2 UDP特性 四、总结 课程内容一、网络通信编程基础知识1.1 什么是Socket1.2 长连…

Linux C语言

一、基础知识 &#xff08;一&#xff09;冯诺依曼体系 1、存储器&#xff1a;内存 存储程序的思想&#xff1a;按照存储器中指令的顺序 2、存储器的分类 1&#xff09;主存&#xff1a;内存&#xff08;C盘&#xff09; 2&#xff09;外存 3&#xff09;寄存器是cpu内部…

Excel和图片如何互相转换?有何技巧?

一、将图片转为excel表格 首先&#xff0c;打开金鸣识别网站&#xff0c;点击“点击添加需转换的图片或PDF”按钮&#xff0c;添加待识别的图片或PDF文件。 添加完待识别的图片或PDF后&#xff0c;点击“提交识别”按钮&#xff0c;程序便开始识别。 识别完成后&#xff0c;系…

Flutter之Widget生命周期

目录 初始化构造函数initStatedidChangeDependencies 运行时builddidUpdateWidget 组件移除deactivatedisposereassemble 函数生命周期说明&#xff1a;实际场景App生命周期 前言&#xff1a;生命周期是一个组件加载到卸载的整个周期&#xff0c;熟悉生命周期可以让我们在合适的…

航天科技×辰安科技 打造智慧化工园区安全保障平台

近年来&#xff0c;国内化工园区安全事故频发&#xff0c;多起化工园区重特大事故造成了严重人员财产损失的同时&#xff0c;也重创了行业的整体发展。在智能制造和工业互联网的背景下&#xff0c;建设智慧化工园区&#xff0c;使用智能化手段实现安全生产是解决当前化工园区安…

【Overload游戏引擎细节分析】视图投影矩阵计算与摄像机

本文只罗列公式&#xff0c;不做具体的推导。 OpenGL本身没有摄像机(Camera)的概念&#xff0c;但我们为了产品上的需求与编程上的方便&#xff0c;一般会抽象一个摄像机组件。摄像机类似于人眼&#xff0c;可以建立一个本地坐标系。相机的位置是坐标原点&#xff0c;摄像机的朝…

2020年下半年~2022下半年下午题易错总结

2020年下半年 试题一&#xff1a; 1.组播报文对无线网络空口的影响主要有(14) &#xff0c;随着业务数据转发的方式不同, 组播报文的抑制分别在 (15)、(16) 配置。 答案&#xff1a; &#xff08;14&#xff09;无线空口拥塞 &#xff08;15&#xff09;直连AP的交换…