加入收藏 | 设为首页 | 会员中心 | 我要投稿 汽车网 (https://www.0577qiche.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 教程 > 正文

ES6+ Symbol使用

发布时间:2023-03-27 13:54:23 所属栏目:教程 来源:
导读:我们知道在 ES5 中, 对象的属性名都是字符串,容易造成属性名冲突。比如,你使用了一个他人提供的对象,但又想为这个对象添加新的方法(mixin 模式),新方法的名字就有可能与现有方法产生冲突,ES6 引入 Symbol 就
我们知道在 ES5 中, 对象的属性名都是字符串,容易造成属性名冲突。比如,你使用了一个他人提供的对象,但又想为这个对象添加新的方法(mixin 模式),新方法的名字就有可能与现有方法产生冲突,ES6 引入 Symbol 就可以解决这个问题。不仅如此 Symbol 的使用还有很多,在元编程中也发挥很大的作用。下面我们就来看看 Symbol 的 使用。

使用 Symbol() 会返回一个独一无二的变量,可以作为对象的 key 存在,返回的值是 symbol 类型,该类型具有静态属性和静态方法。

Symbol([description])
参数    描述
description    (可选)是字符串类型,对 symbol 的描述

Symbol() 是一个方法,返回的值是 symbol 类型,使用如下:

var s1 = Symbol();
var s2 = Symbol();
console.log(s1 === s2)  // false
console.log(typeof s1)    // symbol
上面的代码中,使用 Symbol 声明的变量 s1 和 s2,虽然它们看上去是同一个 Symbol 定义的,但其实是不相等的。

在 Symbol 中可以传入一些参数,来描述定义的 Symbol 类型的值。

var s1 = Symbol('imooc');
var s2 = Symbol('imooc');
console.log(s1)         // Symbol(imooc)
console.log(s1 === s2)  // false
let s = Symbol({name: 'imooc'});
console.log(s);         // Symbol([object Object])
上面的代码中,Symbol 接收的参数是一个对 Symbol 的描述,即使两个 Symbol 接收相同值,两个值也是不一样的。另外,如果传入的描述符是对象类型,内部会将描述的内容进行 toString 操作,所以返回的结果是 [object Object]。

Symbol 经常会作为对象的属性存在,如果这个属性是用 symbol 来声明的,则不可枚举,也不能用 for...in、for...of 迭代。

对象上的 key,可以用取值表达式 (中括号) 的方式取出来,作为对象上的属性,如下:

var s = Symbol('imooc');
var obj = {
  [s]: 
}
obj     // {Symbol(imooc): 1}
obj[s]  // 1
上面的代码,使用 Symbol 声明了一个变量,然后作为对象的 key 给它赋值。取值的时候只能使用中括号的方式,因为这里的 s 是变量不能使用点的方式。下面是对 obj 对象用 for...in 进行的遍历。

for(let key in obj) {
  console.log(obj[key])
}
// undefined
上面的代码对 obj 对象进行迭代,但是没有打印出对应的值,说明用 Symbol 来声明的属性是不可枚举的。如果想要获取到这个属性可以使用 Object.getownPropertySymbols(obj) 获取。使用 Object.keys()、Object.getownPropertyNames()、JSON.stringify() 也是不能返回想要的结果。

Object.getownPropertySymbols(obj);   // [Symbol(imooc)]
Object.keys(obj);                    // []
Object.getownPropertyNames(obj);     // []
JSON.stringify(obj);                 // "{}"
从上面的代码中可以看到使用 Object.getownPropertySymbols() 可以获取对象上所有 Symbol 类型的属性,并返回一个数组。

另外,可以通过 description 方法获取 Symbol 类型描述。

var s = Symbol('imooc');
s.description;    // "imooc"

Symbol.for(key) 方法也是声明变量使用,不同的是 Symbol.for(key) 是在全局作用域下声明的。它会根据给定的键 key 从运行时的 symbol 注册表中找到对应的 symbol。如果找到了,则返回它。否则,新建一个与该键关联的 symbol,并放入全局的 symbol 注册表中,如果有已经声明了的 symbol 则不回重复声明。

let s1 = Symbol.for('imooc');  
let s2 = Symbol.for('imooc');
function fn() {
  return Symbol.for('imooc');
}
console.log(s1, s2)       // Symbol(imooc) Symbol(imooc)
console.log(s1 === s2)    // true
console.log(fn() === s1)    // true
上面的代码中可以看出来,使用 Symbol.for(key) 无论在哪里进行声明,都不会影响它们的值。

Symbol.keyFor() 通过 key 值获取 symbol 的描述:

let s1 = Symbol.for('imooc');  
console.log(Symbol.keyFor(s1))  // imooc

(编辑:汽车网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章