资讯专栏INFORMATION COLUMN

ES6的Symbol数据类型的学习

SimpleTriangle / 444人阅读

摘要:新的原始数据类型,表示独一无二的值其他的数据类型包括基本知识注意不能使用,因为它不是对象参数是一个对象,就会调用该对象的方法,然后才生成一个值值不可以运算可以显式转为字符串可以转为布尔值,但是不能转为数值可以防止某一个键被改写或覆盖使用值定

新的原始数据类型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://www.ucloud.cn/yun/84903.html

相关文章

  • ES6学习笔记之Symbol

    摘要:前端技术日新月异,不断有新技术出现,我们就需要不断地学习新知识,虽然已经提出很久了,但是最近我才有时间静下心来好好学习一下里面提出的新规则。 前端技术日新月异,不断有新技术出现,我们就需要不断地学习新知识,虽然ES6已经提出很久了,但是最近我才有时间静下心来好好学习一下里面提出的新规则。今天总结下ES6提出的这个新的原始数据类型--Symbol。 为啥需要Symbol 一个新规则的提出...

    leo108 评论0 收藏0
  • ES6学习总结(一)

    摘要:可以通过调用方法将创建一个新的类型的值,这个值独一无二,不与任何值相等。还可以使可扩展,在中,表达式被标准化为构造函数的一个方法,这意味着它是可扩展的。 前端发展的太快了,快到ES6,ES7出来之后,今年已经是ES8了,但是纵然前端发展很快,我们除了马不停蹄的学习新的技术之外,也要沉下心来,好好的潜心磨砺自己,本文是整理了自己学习ES6之后相关的知识要点,寄希望于书之于笔,一来自己可以...

    _ipo 评论0 收藏0
  • 重学前端学习笔记(六)--JavaScript类型有哪些你不知道细节?

    摘要:的码点被称为基本字符区域。关于的介绍,我准备用文档阮一峰来做一些介绍,具体的可以参考文档引入的原因的对象属性名都是字符串,这容易造成属性名的冲突。其他的一些属性可以去看文档阮一峰注意函数前不能使用命令,否则会报错。 笔记说明 重学前端是程劭非(winter)【前手机淘宝前端负责人】在极客时间开的一个专栏,每天10分钟,重构你的前端知识体系,笔者主要整理学习过程的一些要点笔记以及感悟,完...

    Lsnsh 评论0 收藏0
  • 重学前端学习笔记(六)--JavaScript类型有哪些你不知道细节?

    摘要:的码点被称为基本字符区域。关于的介绍,我准备用文档阮一峰来做一些介绍,具体的可以参考文档引入的原因的对象属性名都是字符串,这容易造成属性名的冲突。其他的一些属性可以去看文档阮一峰注意函数前不能使用命令,否则会报错。 笔记说明 重学前端是程劭非(winter)【前手机淘宝前端负责人】在极客时间开的一个专栏,每天10分钟,重构你的前端知识体系,笔者主要整理学习过程的一些要点笔记以及感悟,完...

    joyvw 评论0 收藏0

发表评论

0条评论

SimpleTriangle

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<