ES6中Symbol类型用法实例详解


Posted in Javascript onApril 06, 2017

本文实例讲述了ES6中的Symbol类型。分享给大家供大家参考,具体如下:

Symbol是在ES6中新加入的类型。

正如我们所知,JavaScript中有以下几种类型:

Undefined ,Null ,Boolean ,Number ,String, Object

但是上述类型在处理某些情况的时候是远远不够的。下面我们来举一个例子:

假设我们要移动div,也需要在某些情况下判断该div是否处于移动状态,所以我们会想到给div这类的对象设置一个属性。

if (element.isMoving) {
 smoothAnimations(element);
}
element.isMoving = true;

但是这样会存在一些问题,比如:

我们可能和第三方的库冲突

我们可能和未来的标准冲突等

于是可以采用第二种方法,也就是采用加密函数,制定一个值:

var isMoving = SecureRandom.generateName();
...
if (element[isMoving]) {
 smoothAnimations(element);
}
element[isMoving] = true;

这样确实解决了冲突问题,但却带来了调试问题,我们每次查看该对象属性时都会看见一大堆垃圾命名。

于是为了解决冲突问题,ES6提出了Symbol这样的新类型。

Symbol是一种特殊的、不可变的数据类型,可以作为对象属性的标识符使用。我们看demo:

var sym1 = Symbol();
var sym2 = Symbol("foo");
var sym3 = Symbol("foo");

Symbol("foo") 不会强制字符串 "foo" 进入一个Symbol,它每次都创建一个新的Symbol

Symbol("foo") === Symbol("foo"); // false

所以可以利用这个特性来创建私有属性:

(function() {
 // 创建symbol
 var key = Symbol("key");
 function MyClass(privateData) {
  this[key] = privateData;
 }
 MyClass.prototype = {
  doStuff: function() {
   ... this[key] ...
  }
 };
})();
var c = new MyClass("hello")
c["key"] === undefined//无法访问该属性,因为是私有的

也可以利用Symbol来解除上面所说的冲突问题:

// create a unique symbol
var isMoving = Symbol("isMoving");
...
if (element[isMoving]) {
 smoothAnimations(element);
}
element[isMoving] = true;

当然,也可以通过另外的调用方法来生成可以与外界共享的Symbol类型,就是Symbol.for方法

Symbol.for(key) 方法会根据给定的键 key,来从 symbol 注册表中找到对应的 symbol,如果找到了,则返回它,否则,新建一个与该键关联的 symbol,并放入 symbol 注册表中。

Symbol.for("foo"); // 创建一个 symbol 并放入 symbol 注册表中,键为 "foo"
Symbol.for("foo"); // 从 symbol 注册表中读取键为"foo"的 symbol
Symbol.for("bar") === Symbol.for("bar"); // true,证明了上面说的
Symbol("bar") === Symbol("bar"); // false,Symbol() 函数每次都会返回新的一个 symbol
var sym = Symbol.for("mario");
sym.toString();
// "Symbol(mario)",mario 既是该 symbol 在 symbol 注册表中的键名,又是该 symbol 自身的描述字符串

所以为了防止冲突,我们最好给symbol带上前缀:

Symbol.for("mdn.foo");
Symbol.for("mdn.bar");

希望本文所述对大家ECMAScript程序设计有所帮助。

Javascript 相关文章推荐
通过Unicode转义序列来加密,按你说的可以算是混淆吧
May 06 Javascript
jQuery.get、jQuery.getJSON、jQuery.post无法返回JSON问题的解决方法
Jul 28 Javascript
jquery使用ColorBox弹出图片组浏览层实例演示
Mar 14 Javascript
JavaScript使用Prototype实现面向对象的方法
Apr 14 Javascript
使用jquery/js获取iframe父子级、同级获取元素的方法
Aug 05 Javascript
Jquery组件easyUi实现选项卡切换示例
Aug 23 Javascript
Node.js包管理器Yarn的入门介绍与安装
Oct 17 Javascript
jquery实现一个全局计时器(商城可用)
Jun 30 jQuery
JS实现中文汉字按拼音排序的方法
Oct 09 Javascript
javascript代码优化的8点总结
Jan 29 Javascript
微信小程序 WXML节点信息查询详解
Jul 29 Javascript
JavaScript实现4位随机验证码的生成
Jan 28 Javascript
vue中mint-ui环境搭建详细介绍
Apr 06 #Javascript
B/S(Web)实时通讯解决方案分享
Apr 06 #Javascript
HTML中使背景图片自适应浏览器大小实例详解
Apr 06 #Javascript
ES6中的箭头函数实例详解
Apr 06 #Javascript
ES6字符串模板,剩余参数,默认参数功能与用法示例
Apr 06 #Javascript
详谈js遍历集合(Array,Map,Set)
Apr 06 #Javascript
javascript中this用法实例详解
Apr 06 #Javascript
You might like
php 缓存函数代码
2008/08/27 PHP
php中3des加密代码(完全与.net中的兼容)
2012/08/02 PHP
PHP 网站修改默认访问文件的nginx配置
2017/05/27 PHP
JavaScript网页制作特殊效果用随机数
2007/05/22 Javascript
Mootools 1.2教程 函数
2009/09/15 Javascript
在浏览器窗口上添加遮罩层的方法
2012/11/12 Javascript
js中document.write使用过程中的一点疑问解答
2014/03/20 Javascript
深入理解JavaScript系列(31):设计模式之代理模式详解
2015/03/03 Javascript
jQuery实现TAB风格的全国省份城市滑动切换效果代码
2015/08/24 Javascript
学习JavaScript设计模式(策略模式)
2015/11/26 Javascript
jQuery实现页面顶部显示的进度条效果完整实例
2015/12/09 Javascript
jQuery焦点图插件SaySlide
2015/12/21 Javascript
jquery+css实现侧边导航栏效果
2017/06/12 jQuery
jQuery使用ajax_动力节点Java学院整理
2017/07/05 jQuery
Angular4绑定html内容出现警告的处理方法
2017/11/03 Javascript
详解js正则表达式验证时间格式xxxx-xx-xx形式
2018/02/09 Javascript
20个最常见的jQuery面试问题及答案
2018/05/23 jQuery
koa-router源码学习小结
2018/09/07 Javascript
JavaScript实现雪花飘落效果
2020/12/27 Javascript
[50:58]2018DOTA2亚洲邀请赛3月29日 小组赛A组OpTic VS Newbee
2018/03/30 DOTA
实例讲解Python的函数闭包使用中应注意的问题
2016/06/20 Python
关于反爬虫的一些简单总结
2017/12/13 Python
只需7行Python代码玩转微信自动聊天
2019/01/27 Python
python pandas dataframe 去重函数的具体使用
2020/07/20 Python
Python实现小黑屋游戏的完整实例
2021/01/06 Python
python学习之使用Matplotlib画实时的动态折线图的示例代码
2021/02/25 Python
html5 figure和figcaption的使用方法
2018/09/10 HTML / CSS
施华洛世奇巴西官网:SWAROVSKI巴西
2019/12/03 全球购物
JYSK加拿大:购买家具、床垫、家居装饰等
2020/02/14 全球购物
精选鞋类、服装和配饰的全球领先目的地:Bodega
2021/02/27 全球购物
中式结婚主持词
2014/03/14 职场文书
关于感恩的演讲稿200字
2014/08/26 职场文书
2015年环境监察工作总结
2015/07/23 职场文书
管理者们如何制定2019年的工作计划?
2019/07/01 职场文书
golang http使用踩过的坑与填坑指南
2021/04/27 Golang
电脑只能进入安全模式无法正常启动的解决办法
2022/04/08 数码科技