ES6之symbol

ES6引入了一种新的原始数据类型Symbol,是第七种数据类型,表示独一无二的值。语法:

var sym = Symbol();
console.log(typeof sym);//symbol

Symbol函数接收一个字符串参数,表示描述,主要为了在控制台显示或者转成字符串区分:

var sym1 = Symbol('sym1');
var sym2 = Symbol('sym2');
console.log(sym1);//Symbol(sym1)
console.log(sym2);//Symbol(sym2)

如果是对象,会调用toString方法:

var obj = { 
  toString(){ 
    return 'sym' 
  }
}
var sym = Symbol(obj)
console.log(sym);//Symbol(sym)

Symbol参数只表示当前值的描述,因为Symbol表示独一无二,所以所有的Symbol都不相等,不管有没有参数:

var sym1 = Symbol();
var sym2 = Symbol();
console.log(sym1 == sym2);//false

Symbol不能进行运算,会报错,可以显示转成字符串,也可以当做布尔值,都是true,但是不能转成数值:

var sym1 = Symbol();
console.log(sym1 + 'is');//TypeError
console.log(Boolean(sym1));//true
console.log(Number(sym1));//TypeError

作为属性名只能通过[]:

var sym1 = Symbol();
var obj = {};
obj[sym1] = 'sym1';
console.log(obj[sym1]);//sym1

作为属性名,最主要的就是这个key是独一无二的,不会被覆盖或者改写

消除魔术字符串:

魔术字符串就是一个字符串在多个地方出现,当我们要修改这个字符串的时候需要所有都修改,想消除就是把这个字符串变成变量,想修改只需要改一个变量。通过symbol的独一无二很适合把这个变量通过对象属性变成Symbol。

遍历:

Symbol的属性不能通过for in或者for of获取,Object.keys()、Object.getOwnPropertyNames()、JSON.stringify()也无法获取,getOwnPropertySymbols能获取Symbol的,ownKeys能获取所有的:

var obj = { 
  [Symbol('syml')]: 'syml', 
  con: 'con'
}
for(var i in obj){ 
  console.log(i);//con
}
console.log(Object.keys(obj));//[con]
console.log(Object.getOwnPropertySymbols(obj));//[Symbol(syml)]
console.log(Reflect.ownKeys(obj));//["con", Symbol(syml)]

利用这个特性,可以为对象定义一些非私有的、但又希望只用于内部的方法。

Symbol.for():

Symbol.for()接受一个字符串作为参数,然后搜索有没有以该参数作为名称的 Symbol 值。如果有,就返回这个 Symbol 值,否则就新建并返回一个以该字符串为名称的 Symbol 值:

var sym1 = Symbol.for('syml');
var sym2 = Symbol.for('syml');
console.log(sym1 == sym2);//true

Symbol.for()会被登记在全局环境中供搜索,不会每次调用就返回一个新的 Symbol 类型的值,而是会先检查给定的key是否已经存在,如果不存在才会新建一个值。

Symbol.keyFor()返回一个已登记的 Symbol 类型值的key:

var sym1 = Symbol.for("sym1");
console.log(Symbol.keyFor(sym1)); // "sym1"
var sym2 = Symbol("sym2");
console.log(Symbol.keyFor(sym2)); // undefined

有一点很有趣Symbol.for为 Symbol 值登记的名字,是全局环境的,可以在不同的 iframe 或 service worker 中取到同一个值。可以用来通信。

内置的属性方法:

Symbol提供了11个内置的属性,看了一遍,觉得还是不需要研究的好。

最后总结一下,Symbol是新增的数据类型,表示独一无二:

var sym1 = Symbol();
var sym2 = Symbol();
console.log(sym1 == sym2);//false

用来做属性的key,不会被修改覆盖。

(完)

本文分享自微信公众号 - coding个人笔记(gh_2ce38b49dae1),作者:wade

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2019-04-20

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 模块化之AMD、CMD、UMD、commonJS

    做后台的对模块化的思想很清晰,都是类、继承什么的,而JavaScript早期开始就没有包、类模块的概念,甚至只有函数作用域。

    wade
  • v-if和v-show的区别

    vue使用过程中,v-show和v-if必不可少,但是很多人在用的时候都不知道两者到底有什么区别,大都是按照习惯去使用,其实两者是要分场合使用的。

    wade
  • 做个微前端demo

    之前已经分享过微前端,至于落地还是不落地就看公司和项目了,今天基于微前端做了个小demo,分享一下。可以去qiankun官网看看,包括微前端核心设计理念、为什么...

    wade
  • es6 Symbol

    1.Symbol 值通过Symbol 函数生成,凡是属性名属于Symbol 类型,就是   独一无二的,可以保证不会与其他属性名冲突。       // 没有参...

    用户1197315
  • 理解 Es6 中的 Symbol 类型

    在 Es6 中引入了一个新的基础数据类型:Symbol,对于其他基本数据类型(数字number,布尔boolean,null,undefined,字符串stri...

    itclanCoder
  • ES6中的Symbol有什么卵用

    在ES6中新增了一中类型,这个类型叫做Symbol,最大的特点号称独一无二,下面我们来说一下这东西怎么用,最后再说一下他用在哪。

    无邪Z
  • Javascript Symbol 解惑 什么是Symbol创建Symbol如何使用Symbol

    Symbol是ES6中新引入的一种基本数据类型,在此之前Javascript中已有几种基本数据类型:

    MudOnTire
  • 前端测试题: 关于Symbol,错误的说法是?

    Symbol是由ES6规范引入的一项新特性,它的功能类似于一种标识唯一性的ID。通常情况下,我们可以通过调用Symbol()函数来创建一个Symbol实例.

    舒克
  • 重温 ES6 Symbol

    1.Symbol 通过工厂函数创建,不能以 new 的方式创建,所以使用 instanceof 运算符返回的结果为 false

    阿宝哥
  • 理解和使用ES6中的Symbol

    ES6中引入了一种新的基础数据类型:Symbol,不过很多开发者可能都不怎么了解它,或者觉得在实际的开发工作中并没有什么场景应用到它,那么今天我们来讲讲这个数据...

    一斤代码

扫码关注云+社区

领取腾讯云代金券