ES6中Symbol的详细介绍(代码示例)
Mar 13, 2019 pm 01:34 PM本篇文章给大家带来的内容是关于ES6中Symbol的详细介绍(代码示例),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。
Symbol 是 ES6 引入的一种新的原始数据类型,表示独一无二的值。
Symbol 特性
1.Symbol 通过工厂函数创建,不能以 new 的方式创建,所以使用 instanceof 运算符返回的结果为 false
1 2 3 |
|
2.Symbol 使用 typeof 运算符返回 “symbol”
1 2 |
|
3.Symbol 工厂函数能支持一个可选的参数,用于描述当前的 symbol
1 2 |
|
4.Symbol 是唯一的,Symbol("foo") == Symbol("foo") 返回 false
1 |
|
5.Symbol 与数值或字符串进行运算时,会抛出异常
1 2 |
|
6.Symbol 工厂函数返回的 symbol,可作为对象的属性名,可以避免属性冲突,在 for...in 迭代中不可枚举
1 2 3 4 5 6 7 8 |
|
7.Symbol 工厂函数返回的值,可作为对象属性名,当使用 JSON.stringify() 进行序列化时,该属性会被忽略
1 |
|
8.Symbol 是唯一的,但可以使用 Symbol.for() 共享同一个 Symbol 值
1 2 3 |
|
Symbol 实战
对象字面量私有属性和方法
1 2 3 4 5 6 7 8 9 10 11 12 13 |
|
除了在创建对象字面量时可以使用 Symbol 外,在定义类的私有属性和方法时也可以使用。
类的私有属性和方法
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
|
在 ES6 中,引入了一些全局的 Symbols,比如:Symbol.match,Symbol.replace,Symbol.search,Symbol.iterator 和 Symbol.split。这里我们简单介绍一下 Symbol.search 和 Symbol.iterator。
Symbol.iterator
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
|
Symbol.search
先来简单看个示例:
1 |
|
该示例的执行流程:
解析 'angular'.search('ng')
把 ‘angular’ 转换为字符串对象 new String('angular')
把 ‘ng’ 转换为正则对象 new Regexp('ng')
调用 ‘angular’ 字符串对象的 search 方法,该方法内部会自动调用 ng 正则对象的 Symbol.search 方法
具体可以参考以下伪代码:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
|
此外利用 Symbol.search 我们还可以让 String.prototype.search() 方法调用我们自定义对象内部的 Symbol.search() 方法,从而实现自定义 search 逻辑:
1 2 3 4 5 6 7 8 9 10 11 |
|
以上示例的执行流程:
解析 'Angular7'.search(article) 语句
把 ‘Angular7’ 转换为字符串对象 new String("Angular7")
由于 article 是对象,这里不需要进行转换
调用 ‘Angular7’ 字符串对象的 search 方法,该方法会自动调用 article 对象内部的 Symbol.search 方法,比如 article[Symbol.search]('Angular7')
Atas ialah kandungan terperinci ES6中Symbol的详细介绍(代码示例). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Artikel Panas

Alat panas Tag

Artikel Panas

Tag artikel panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

Bagaimana untuk membalikkan tatasusunan dalam ES6

Bagaimana untuk mencari item yang berbeza dalam dua tatasusunan dalam es6

Mengapakah program mini perlu menukar es6 kepada es5?

Apakah maksud zon mati sementara es6?
