发表日期:2019-09 文章编辑:小灯 浏览次数:8971
Symbol这个词在IT软件领域实际上是个常见角色,在传统前端技术领域,这个词出现频率有限,但是,随着现代web技术的发展,Symbol这个词开始在不同前端语言中出现。
symbol的中文意思是:符号;象征;标志;记号等。
我最早知道是在Adobe Illustrator软件中,作为一个矢量符号存在。在SVG中,就有专门的<symbol>标签,用来指代SVG小图标。
在这里,Symbol又有了另外的角色,作为一个JavaScript的原生数据类型(primitive data type)存在。
说到JavaScript原生数据类型,我们通常想到的有这6种:undefined、null、boolean、string、number、object。而symbol是ES6新增的一个原生数据类型。ES6引入了一种新的原始数据类型Symbol,表示独一无二的值。
Symbol函数前不能使用new命令,否则会报错。这是因为生成的Symbol是一个原始类型的值,不是对象。会报下面的错误:
Uncaught TypeError: Symbol is not a constructor
Symbol函数可以接受一个字符串作为参数,表示对Symbol实例的描述,主要是为了在控制台显示,或者转为字符串时,比较容易区分。
而Symbol本身又是一个方法。
例如下面JS:
typeof Symbol();
可以看到Symbol()作为一个方法执行了,同时typeof其类型,也是'symbol',如下截图:
Symbol的作用非常的专一,换句话说其设计出来就只有一个目的——作为对象属性的唯一标识符,防止对象属性冲突发生。
举个例子,你看上了公司前来的前台妹纸,想了解关于她的更多信息,于是就询问Hr同事,扫地阿姨,于是得到类似这样信息:
let info1 = {name: '塔灯网络',age: 24,job: 'www.xttblog.com',description: '平时喜欢做做瑜伽,人家有男朋友,你别指望了'}let info2 = {description: '这小姑娘挺好的,挺热情的,嘿嘿嘿……'}
显然,你需要对这两个数据进行汇总,结果,就会发现,描述都用了同一个对象属性description,于是整合的时候,就容器冲突,覆盖,导致“人家有男朋友”这么重要的信息都没注意到。
但是,如果要是Symbol,则完全就不要担心这个问题了:
let info1 = {name: '婷婷',age: 24,job: '公司前台',[Symbol('description')]: '平时喜欢做做瑜伽,人家有男朋友,你别指望了'}let info2 = {[Symbol('description')]: '这小姑娘挺好的,挺热情的,嘿嘿嘿……'}
此时,我们对info1, info2对象进行复制,如下:
let target = {};Object.assign(target, info1, info2);
此时target对象如下截图所示:
妹纸所有的描述信息都被完完整整地保留了下来了。
因为Symbol()返回值是唯一的,也就是:
Symbol('description') === Symbol('description');// 返回值是false
Symbol值不能与其他类型的值进行运算
// 没有参数的情况var s1 = Symbol();var s2 = Symbol();s1 === s2 // false// 有参数的情况var s1 = Symbol("foo");var s2 = Symbol("foo");s1 === s2 // false
Symbol作为属性使用。
var mySymbol = Symbol();// 第一种写法var a = {};a[mySymbol] = 'Hello!';// 第二种写法var a = {[mySymbol]: 'Hello!'};// 第三种写法var a = {};Object.defineProperty(a, mySymbol, { value: 'Hello!' });// 以上写法都得到同样结果a[mySymbol] // "Hello!"
Symbol值作为对象属性名时,不能用点运算符。
var a = {};var name = Symbol();a.name = 'lili';a[name] = 'lucy';console.log(a.name,a[name]); //lili,lucy
Symbol值作为属性名时,该属性还是公开属性,不是私有属性。
这个有点类似于java中的protected属性(protected和private的区别:在类的外部都是不可以访问的,在类内的子类可以继承protected不可以继承private)
但是这里的Symbol在类外部也是可以访问的,只是不会出现在for…in、for…of循环中,也不会被Object.keys()、Object.getOwnPropertyNames()返回。但有一个Object.getOwnPropertySymbols方法,可以获取指定对象的所有Symbol属性名。
日期:2019-09 浏览次数:6808
日期:2019-09 浏览次数:4673
日期:2019-09 浏览次数:5491
日期:2019-09 浏览次数:10706
日期:2019-09 浏览次数:10750
日期:2019-09 浏览次数:4462
日期:2019-09 浏览次数:4052
日期:2019-09 浏览次数:3874
日期:2019-09 浏览次数:3446
日期:2019-09 浏览次数:4168
日期:2019-09 浏览次数:7899
日期:2019-09 浏览次数:3698
日期:2019-09 浏览次数:4221
日期:2019-09 浏览次数:3735
日期:2019-09 浏览次数:3874
日期:2019-09 浏览次数:4159
日期:2019-09 浏览次数:5743
日期:2019-09 浏览次数:3431
日期:2019-09 浏览次数:4472
日期:2019-09 浏览次数:3925
日期:2019-09 浏览次数:4165
日期:2019-09 浏览次数:4204
日期:2019-09 浏览次数:3538
日期:2019-09 浏览次数:4367
日期:2019-09 浏览次数:5474
日期:2019-09 浏览次数:5323
日期:2019-09 浏览次数:3607
日期:2019-09 浏览次数:8970
日期:2019-09 浏览次数:4573
日期:2019-09 浏览次数:3905
Copyright ? 2013-2018 Tadeng NetWork Technology Co., LTD. All Rights Reserved.