【ES6】JS第7种数据类型:Symbol

  • 一、Symbol的由来
  • 二、Symbol的涵义
  • 三、Symbol的判等
  • 四、Symbol的运算与转化
  • 查看更多ES6教学文章:
  • 参考文献

引言:我们知道JS的六大数据类型分别是:Undefined、Null、布尔值(Boolean)、字符串(String)、数值(Number)、对象(Object)。现ES6新增第7种数据类型,Symbol类型。

一、Symbol的由来

ES5的对象属性名都是字符串,这容易造成属性名的冲突。比如,你使用了一个他人提供的对象,但又想为这个对象添加新的方法( mixin模式),新方法的名字就有可能与现有方法产生冲突。
        如果有种机制,能够保证每个属性的名字都是独一无二的就好了,这样就能从根本上防止属性名冲突。这就是ES6引人Symbol的原因。
        ES6引入了一种新的原始数据类型Symbol,表示独一无二的值。它是JavaScript语言的第7种数据类型,前6种分别是: Undefined 、Null、布尔值( Boolean)、字符串( String )、数值( Number )和对象( Object)。
        Symbol值通过Symbol函数生成。这就是说,对象的属性名现在可以有两种类型:一种是原来就有的字符串,另一种就是新增的 Symbol类型。只要属性名属于Symbol类型,就是独一无的,可以保证不会与其他属性名产生冲突。
        参考代码块1-1。

/***@@    代码块1-1        @@***/
let s = Symbol();
typeof S
// "symbol"

二、Symbol的涵义

在代码块1-1中,变量s就是一个独一无二的值。typeof运算符的结果表明变量s是Symbol数据类型,而不是字符串之类的其他类型。
        注意,Symbol函数前不能使用new命令,否则会报错。这是因为生成的Symbol是一个原始类型的值,不是对象。也就是说,由于Symbol值不是对象,所以不能添加属性。基本上,它是一种类似于字符串的数据类型。
        Symbol函数可以接受一个字符串作为参数,表示对Symbol实例的描述,主要是为了在控制台显示或转为字符串时比较容易区分。见代码块2-1。

/***@@    代码块2-1        @@***/
var s1 = Symbol('foo');
var s2 = Symbol('bar ');
s1 // Symbol(foo)
s2 // Symbol(bar)
s1.toString() // "Symbol(foo)"
s2.toString() // "Symbol(bar)"

三、Symbol的判等

上面的代码块2-1中,s1和s2是两个Symbol值。如果不加参数,它们在控制台的输出都是Symbol(),不利于区分。有了参数以后,就等于为它们加上了描述,输出时就能够分清到底是哪一个值。
        注意,Symbol 函数的参数只表示对当前Symbol值的描述,因此相同参数的Symbol函数的返回值是不相等的。
        见代码块3-1。

/***@@    代码块3-1        @@***/
//没有参数的情况
var s1 = Symbol();
var s2 = Symbol();
s1 === s2 // false
//有参数的情况
var s1 = Symbol("foo");
var s2 = Symbol("foo");
s1 === s2 // false

上面的代码中,s1和s2都是Symbo类型的返回值,而且参数相同,但是它们是不相等的。

四、Symbol的运算与转化

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

var sym = Symbol( 'My symbol');"your symbol is”+ sym
// TypeError: can't convert symbol to string
`your symbol is ${sym}`
// TypeError: can't convert symbol to string

但是,Symbol值可以显式转为字符串。

var syn= Symbol('My symbol'); String(sym) // 'Symbol(My symbol)'
sym.toString() // 'Symbol(My symbol)'

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

var sym = Symbol();
Boolean(sym) // true
!sym // false
if (sym) {// ...
}Number(sym) // TypeError
sym + 2 //TypeError

查看更多ES6教学文章:

1. 【ES6】let与const 详解
2. 【ES6】变量的解构赋值
3. 【ES6】字符串的拓展
4. 【ES6】正则表达式的拓展
5. 【ES6】数值的拓展
6. 【ES6】数组的拓展
7. 【ES6】函数的拓展
8. 【ES6】对象的拓展
9. 【ES6】JS第7种数据类型:Symbol
10. 【ES6】Proxy对象
11. 【ES6】JS的Set和Map数据结构
12. 【ES6】Generator函数详解
13. 【ES6】Promise对象详解
14. 【ES6】异步操作和async函数
15. 【ES6】JS类的用法class
16. 【ES6】Module模块详解
17. 【ES6】ES6编程规范 编程风格

参考文献

阮一峰 《ES6标准入门(第2版)》

【ES6】JS第7种数据类型:Symbol相关推荐

  1. php解析js的 arraybuffer_JS的所谓的第七种数据类型Symbol

    首先,为什么说叫所谓呢?因为在2007年之前Js给予我们typeof解析数据类型的一共有六种(一直有争议,但是我们暂时就按typeof来算) 'function''Number''Object''bo ...

  2. js中有哪几种数据类型

    js中有哪几种数据类型 js有八种数据类型 : number,string,boolean,undefined,null,Object,bigint,symbol 数据类型检测的方法 typeof判断 ...

  3. JS 几种数据类型及其转换

    ECMAScript 标准定义了 7 种数据类型: Number:String:Boolean:Symbol:Null:Undefined:Object .通常,数值.字符串.布尔值.undefine ...

  4. ES6新数据类型Symbol

    Symbol 今年最火的莫过于 ES6 + Babel 了.ES6 引入了一些很实用很强大的特性和一些语法.今天说的 Symbol 就是其中一个. 对于这个新特性,很多人估计很少使用它,尤其是可见性封 ...

  5. js中的8种数据类型

    js中的数据类型 6种基本数据类型: Number (基本数据类型)(NaN) String Boolean Null (null) Undefined (undefined) Object (引用数 ...

  6. 9种数据类型,数据类型区别及判断数据类型方法

    基本数据类型: String,Number,null,undefined,Boolean  (通常所说的五种原始数据类型),Symbol,BigInt (ES6新增) 引用类型: object  [基 ...

  7. [HTML CSS JS ES6 JS WebAPI JQuery]学习笔记目录

    文章目录 前言 HTML HTML 知识整理与补充 CSS CSS 知识整理与补充 JS ES6 JS Web API JQuery JS 知识整理与补充 前言 根据视频和PPT整理 视频及对应资料: ...

  8. JavaScript 数据类型——八种数据类型总结

    JavaScript 目前包含八种数据类型,其中可以分成两大类. 基本数据类型(原始值): Number(数值,包含NaN) String(字符串) Boolean(布尔值) Undefined(未定 ...

  9. js经典试题之数据类型

    js经典试题之数据类型 1:输出"B" + "a" + + "B" + "a"的值: 答案:BaNaNa. 分析:因为+ ...

最新文章

  1. 哈佛博士生教你轻松愉快地读博
  2. [Android] 通过GridView仿微信动态添加本地图片
  3. 网工学Python——初识面向对象
  4. python项目部署nginx_【python】Django web项目部署(Nginx+uwsgi)
  5. zookeeper 单机和集群搭建(windows环境+linux环境)
  6. ef mysql db first_Net Core使用EF之DB First
  7. Spring Boot整合批量文件下载功能
  8. Linux(3)--防火墙
  9. html下移,jQuery实现元素的上移下移删除
  10. layui option 动态添加_layuiselect如何动态添加option
  11. php感悟1500,《与美同行》读后感1500字
  12. windows黑窗命令
  13. loadrunner11 java脚本_LoadRunner11开发Java Vuser协议脚本
  14. MapGISK9安装
  15. 使用第三方SDK进行网页授权
  16. 大曝光:淘宝店卖论文,10年卖100多篇SCI获利300万!
  17. C#——检测鼠标滑轮事件
  18. 饭后七个好习惯吃饱吃好不发胖
  19. Mach3寻边和对刀代码
  20. 数据可视化-设计原则

热门文章

  1. React 项目----setState 方法修改 state (16)
  2. SpringBoot mybatis 输出SQL语句到控制台
  3. 网页中的load函数
  4. opencv文件路径问题
  5. 提高android 运行效率,如何提高安卓手机运行速度 提高安卓手机运行速度方法
  6. mysql 创建库 5.7_MySQL数据库之MySQL5.7创建用户时报错
  7. 在线作图|如何绘制一张坡度图
  8. 爱尔兰 APC 微生物组研究所—菌群研究的全球领航者之一
  9. IJMS:牧医所奶业创新团队在瘤胃微生物新型脲酶抑制剂开发方面取得新进展
  10. Nature:复杂菌群空间分布研究