1. 犀牛前端部落首页
  2. Javascript百科

ES6 Symbol概念与作用

Symbol是ES6中新赠的数据类型,在ES5中是没有的,本篇文章围绕Symbol 的概念和作用,给大家分析Symbol的作用和特性以及如何使用和相关的注意事项。

概念

Symbol是一种提供独一无二的值的数据类型。

作用

//ES5中我们可以多次声明一个值
var a = 5;
var b = 5;
a ===b; //true

//ES6中声明的值永远都不相等,保证唯一性
let a = Symbol();
let b = Symbol();
a===b; //false

如果我们使用的时候,如何再次取到这个值呢?

我们可以使用另外一种声明的办法:

let a = Symbol.for('abc');
let b = Symbol.for('abc');

a===b; //true

Symbol.for 不仅声明了一个独一无二的值,还会去检查全局是否注册过改值,如果已经注册过,那么就会返回该值。

使用场景

let obj = {
[Symbol.for('abc')]:'111',
abc:'1234'
}

如果不使用Symbol,那么key值就会重复,还有一种情况,就是别人继承你的对象,也会造成一些问题。

因此这种情况下使用Symbol,是很完美的,也不会造成一个冲突。

如何取对象中Symbol的值

注: for..in.. 是取不到Symbol声明的值的。

/**
*时间:2019/8/28
*前端教程:https://www.pipipi.net/
*/

let a = Symbol('a');
let obj = {
[a]:'111',
b:'222',
c:'333'
}
for(let [key,value] of Object.entries(obj)){
   console.log('for of',key,value);
}
//输出:
//for of b 222
//for of c 333

那么我们该如何取出Symbol的值呢?

方法一:Object.getOwnPropertySymbols

 

/**
*时间:2019/8/28
*前端教程:https://www.pipipi.net/
*/

let a = Symbol('a');
let obj = {
[a]:'111',
b:'222',
c:'333'
}
Object.getOwnPropertySymbols(obj).forEach(item=>{
 console.log(obj[item])
})
//输出:
//111

Object.getOwnPropertySymbols方法只会将Symbol作为数组返回回来,不能将所有的key返回回来,那么有没有办法可以将所有的key都返回回来呢?

方法二:Reflect.ownKeys

Reflect.ownKeys方法可以将所有的key值都返回回来。

/**
*时间:2019/8/28
*前端教程:https://www.pipipi.net/
*/

let a = Symbol('a');
let obj = {
[a]:'111',
b:'222',
c:'333'
}
Reflect.ownKeys(obj).forEach(item=>{
console.log(obj[item]);
})
//输出:
//222
//333
//111

 

原创文章,作者:犀牛前端部落,如若转载,请注明出处:https://www.pipipi.net/2580.html

发表评论

登录后才能评论