ES6的Symbol数据类型的学习

160 阅读 作者:luckyzv 2017-08-28

新的原始数据类型Symbol,表示独一无二的值
其他的数据类型包括undefined,null,string,number,boolean,object

基本知识

let s = Symbol() // 注意不能使用new,因为它不是对象
typeof s // 'symbol'


let s1 = Symbol('foo')
s1 // Symbol(foo)

// Symbol参数是一个对象,就会调用该对象的toString()方法,然后才生成一个Symbol值
const obj = {
    toString() {
        return 'abc'
    }
}
const sym = Symbol(obj)
sym // Symbol(abc)

let s2 = Symbol('foo')
s1 === s2 // false

// Symbol值不可以运算
console.log('your symbol ' + s1) // TypeError

// Symbol可以显式转为字符串
String(s1) 
sym.toString() // 'Symbol(foo)'

// Symbol可以转为布尔值,但是不能转为数值
Boolean(s) // true
!s // false
Number(s) // TypeError

可以防止某一个键被改写或覆盖

使用Symbol值定义属性时,Symbol值必须放在方括号之中。

let mySym = Symbol()
let a = {}
a[mySym] = 'hello'

let a = {
    [mySym]: 'hello'
}

// 注意点运算符,此时mySym是字符串
a.mySym = 'hello'
a[mySym] // undefined
a['mySym'] // 'hello'

属性名的遍历
Symbol作为属性名,不会出现在for...infor...of循环中,也不会被Object.keys()Object.getOwnPropertyNames()JSON.stringify()返回,有一个Object.getOwnPropertySymbols方法可以获取Symbol属性名

let obj = {}
let foo = Symbol('foo')
Object.defineProperty(obj, foo, {
    value: 'foobar'
})

for (let i in obj) {
    console.log(i) // 无输出
}

Object.getOwnPropertyNames(obj) // []

Object.getOwnPropertySymbols(obj) // [Symbol(foo)]

还有一个全新的APIReflect.ownKeys()可以返回所有类型的键名,包括常规键名和Symbol键名

let obj = {
    [Symbol('my_key')]: 1,
    enum: 2,
    nonEnum: 3
}

Reflect.ownKeys(obj) // ['enum','nonEnum',Symbol(my_key)]
let s1 = Symbol.for('foo') // 不会每次调用就返回一个新的Symbol类型的值
let s2 = Symbol.for('bar') // 调用30次,每次都返回同一个Symbol值,但是Symbol()会返回30个不同的Symbol值
s1 === s2 //true

// 返回一个已登记的Symbol类型值的key
let s1 = Symbol.for('foo')
Symbol.keyFor(s1) // 'foo'

let s2 = Symbol('foo')
Symbol.keyFor(s2) // undefined
原文地址:https://segmentfault.com/a/1190000010857542
广告一下
热门教程
PHP7报A non well formed numeric value encountered 0
Linux系统下关闭mongodb的几种命令分享 0
mongodb删除数据、删除集合、删除数据库的命令 0
Git&Github极速入门与攻坚实战课程 0
python爬虫教程使用Django和scrapy实现 0
libnetsnmpmibs.so.31: cannot open shared object file 0
数据结构和算法视频教程 0
redis的hash结构怎么删除数据呢? 0
C++和LUA解析器的数据交互实战视频 0
mongodb errmsg" : "too many users are authenticated 0
C++基础入门视频教程 0
用30个小时精通C++视频教程可能吗? 0
C++分布式多线程游戏服务器开发视频教程socket tcp boost库 0
C++培训教程就业班教程 0
layui的util工具格式时间戳为字符串 0
C++实战教程之远程桌面远程控制实战 1
网络安全培训视频教程 0
LINUX_C++软件工程师视频教程高级项目实战 0
C++高级数据结构与算法视频教程 0
跨域问题很头疼?通过配置nginx轻松解决ajax跨域问题 0
相关文章
【译】JavaScript数据结构(3):单向链表与双向链表 16
10个JavaScript难点 16
【译】苹果拒绝支持PWA,有损Web的未来 16
iView 一周年了,同时发布了 2.0 正式版,但这只是开始... 16
nodejs+mongodb构建一个简单登录注册功能 16
【译】JavaScript数据结构(4):树 16
组件化开发与黑箱 16
TypeScript - 不止稳,而且快 16
webpack3+anujs+ReactCSSTransitionGroup 16
原生js实现图片放大镜效果 16
WEB缓存探究第二弹——实战 16
纯笔记:vfork 的一些使用场景(顺便讲一下 fork 的原理) 16
Android APP 内部捐赠实现(支付宝&微信) 16
WKWebView 的一些小总结 16
模型评价(一) AUC大法 16
开始使用GraphQL 16
Webpack模块化原理简析 16
gulp使用问题记录 16
使用Angular4动画为页面添彩 16
Python27 Matplotlib (win64 python2.7) 安装及简单使用 16