ES6 symbol 以及symbol的简单应用
前置
1.ES6 引入了一种新的原始数据类型Symbol,表示独一无二的值。
2.Symbol 值通过Symbol函数生成。
3.Symbol 函数可以接受一个字符串作为参数,表示对 Symbol 实例的描述,主要是为了在控制台显示,或者转为字符串时,比较容易区分。
4.ES2019 提供了一个实例属性description,直接返回 Symbol 的描述。
5.Symbol 值都是不相等的,这意味着 Symbol 值可以作为标识符,用于对象的属性名,就能保证不会出现同名的属性。
6.Symbol 值作为对象属性名时,不能用点运算符,要使用[]。
7.Symbol 值作为属性名时,该属性还是公开属性,不是私有属性。
let s = Symbol();
let obj = {
[s]: function (arg) { ... }
};
obj[s](123);
常用场景
定义一组常量,保证这组常量的值都是不相等的
DEMO1
const log = {};
log.levels = {
DEBUG: Symbol('debug'),
INFO: Symbol('info'),
WARN: Symbol('warn')
};
console.log(log.levels.DEBUG, 'debug message');
console.log(log.levels.INFO, 'info message');
DEMO2
const COLOR_RED = Symbol();
const COLOR_GREEN = Symbol();
function getComplement(color) {
switch (color) {
case COLOR_RED:
return COLOR_GREEN;
case COLOR_GREEN:
return COLOR_RED;
default:
throw new Error('Undefined color');
}
}
常量使用 Symbol 值最大的好处,就是其他任何值都不可能有相同的值了,因此可以保证上面的switch语句会按设计的方式工作。
作为对象的key属性, 防止对象属性被重写
let name = Symbol();
{
plugin = {};
plugin[name] = 'plugin';
console.log(plugin[name]); //plugin
}
{
let name = Symbol();
plugin[name] = 'user';
console.log(plugin[name]); //user
}
console.log(plugin) //{Symbol(): "plugin", Symbol(): "user"}
console.log(plugin[name]); //plugin
ES6 symbol 以及symbol的简单应用的更多相关文章
- ES6中的Symbol
---恢复内容开始--- Symbol 1.1 概述 保证每个属性的名字都是独一无二的就好了,这样就从根本上防止属性名的冲突.这就是 ES6 引入Symbol的原因 在es6之前,JavaScript ...
- ES6入门之Symbol
ES5对象属性名都是字符串容易造成属性名的冲突. eg:var a = { name: 'lucy'}; a.name = 'lili';这样就会重写属性 ES6引入了一种新的原始数据类型Symbol ...
- ES6中的Symbol类型
前面的话 ES5中包含5种原始类型:字符串.数字.布尔值.null和undefined.ES6引入了第6种原始类型——Symbol ES5的对象属性名都是字符串,很容易造成属性名冲突.比如,使用了一个 ...
- es6学习笔记-Symbol
概述 ES5 的对象属性名都是字符串,这容易造成属性名的冲突.比如,你使用了一个他人提供的对象,但又想为这个对象添加新的方法(mixin 模式),新方法的名字就有可能与现有方法产生冲突.如果有一种机制 ...
- ES6新增数据类型Symbol
Symbol的含义? ES6(2015) 引入了第七种原始数据类型Symbol,Symbol英文文意思为 符号.象征.标记.记号,在 js 中更确切的翻译应该为独一无二的 Symbol的使用? Sym ...
- 16. js 判断变量类型,包括ES6 新类型Symbol
相信大家在开发中遇到需要判断变量类型的问题,js变量按存储类型可分为值类型和引用类型,值类型包括Undefined.String.Number.Boolean,引用类型包括object.Array.F ...
- ES6学习之Symbol
定义:一种新的原始数据类型,表示独一无二的值 const a = Symbol(); const b = Symbol("foo") //接收参数的Symbol,参数表示对Symb ...
- 10.1 ES6 的新增特性以及简单语法
ES6 的新增特性以及简单语法 let 和 const 模板字符串 箭头函数 对象单体模式 es6面向对象 模块化 let 和 const 之前一直用 var 来声明变量,ES6 新增 let 和 ...
- es6 新增数据类型Symbol
es6在string number boolean null undefined object之外又新增了一种Symbol类型. Symbol意思是符号,有一个特性—每次创建一个Symbol值都是不一 ...
随机推荐
- 修改Maven的本地仓库地址
已经配置好的设定文件: 1.创建一个本地仓库的地址 2.修改Maven中conf目录下的settings.xml文件 在此处添加修改后的本地仓库的地址 3.打开cmd 输入mvn help:sys ...
- client,offset,scroll系列
client(客户端),offset(偏移),scroll(滚动)1.client系列 clientTop 内容区域到边框顶部的距离 ,说白了,就是边框的高度 clientLeft 内容区域到边框左部 ...
- SYN1618型 高精度天文时间同步系统
SYN1618型 高精度天文时间同步系统 产品概述 SYN1618型 高精度天文时间同步系统是由西安同步电子科技有限公司精心设计.自行研发生产的一款高精度的时频频率标准设备,接收GPS.GLON ...
- JAVA8之lambda表达式详解
原文:http://blog.csdn.net/jinzhencs/article/details/50748202 lambda表达式详解 一.问题 1.什么是lambda表达式? 2.lambda ...
- JVM检测&工具
前几篇篇文章介绍了介绍了JVM的参数设置并给出了一些生产环境的JVM参数配置参考方案.正如之前文章中提到的JVM参数的设置需要根据应用的特性来进行设置,每个参数的设置都需要对JVM进行长时间的监测,并 ...
- 【转】 远程连接mysql
转自:http://www.linuxidc.com/Linux/2013-05/84813.htm 1.确认能ping通 2.确认端口能telnet通.如果user表的host值是localhost ...
- 有关Html页面节点的简单理解
这是之前研究web前端的一点经验,主要针对刚入门还没怎么研究的朋友. 因为我发现我在用js,css参与过网站开发项目后仍然没有理解文本节点与普通节点的差别,所以记下来拿来分享一下. 先上结论:< ...
- yii中 columnszii.widgets.grid.CGridView
<?php $this->widget('zii.widgets.grid.CGridView', array( 'id'=>'chapter-grid', 'dataProvide ...
- .NET开发框架(四)-服务器IIS安装教程
Windows Server 2012 R2 配置篇,包括服务器IIS安装.网络负载均衡器安装.ASP.NET Core 安装. 前三篇教程中,我们分享了框架的功能与视频演示介绍(文尾扫码 加入 框架 ...
- 十分钟教你理解TypeScript中的泛型
转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者.原文出处:https://blog.bitsrc.io/understanding-generics-in-t ...