ES6 Symbol数据类型

Symbol数据类型

    • 1. 什么是Symbol数据类型?
    • 2. Symbol数据类型的应用
      • 1. 解决变量名冲突
      • 2. 消除魔术字符串
      • 3. 全局注册表

1. 什么是Symbol数据类型?

ES6引入的一种新的原始数据类型Symbol,表示独一无二的值。Symbol函数可以接受参数,表示对于这个唯一值的描述。属于基本数据类型,Symbol()函数会返回symbol类型的值。

//创建symbol值
let  sy1=Symbol('三角形');
let  sy2=Symbol('正方形');
console.log(sy1,typeof sy1); //Symbol(三角形) symbol

2. Symbol数据类型的应用

1. 解决变量名冲突

let sy3 = Symbol('name')
let obj={
  name:'zhangsan',
  age:'12'
}
let obj1={
  ...obj,
  // 属性名是变量名时 要使用中括号
  [sy3]:'wangwu'
}
console.log(obj1);
//{ name: 'zhangsan', age: '12', [Symbol(name)]: 'wangwu' }

如果一个引用型数据中使用了Symbol变量,那如何遍历该应用型数据呢?

let sy1 = Symbol('name')
let sy2 = Symbol('age')
let obj ={
  name:'zhangsan',
  age:12,
  [sy1]:'lisi',
  [sy2]:16,
  [Symbol('phone')]:1878910062
}
//Symbol类型的key遍历不出来
for (let key in obj){
  console.log(key); //name age 
}
//使用Object.getOwnPropertySymbols() 方法返回一个给定对象自身的所有 Symbol 属性的数组。
let ss=Object.getOwnPropertySymbols(obj);
console.log(obj[ss[0]]); //lisi

2. 消除魔术字符串

魔术字符串指的是,在代码之中多次出现、与代码形成强耦合(依赖关系强)的某一个具体的字符串或者数值。

function test(shape,options){
	let area=0;
	switch(shape){
		case Shape.SJX:
			area=.5 * options.width*options.height
			break;
		case Shape.ZFX:
			area=options.width*options.height
			break;
		case Shape.CIRCLE:
			area=Math.PI*Math.pow(options.r,2)
			break;
		default:
			area=-1			
	}
	return area
}
let Shape={
	SJX:Symbol('sjx'),
	ZFX:Symbol('zfx'),
	CIRCLE:Symbol('circle')
}
let res=test(Shape.SJX,{width:100,height:100,r:100});
console.log(res);

3. 全局注册表

用 Symbol.for() 方法创建的的 symbol类型值 会被放入一个全局 symbol 注册表中。
每当创建一个新的 symbol类型值时,它会首先检查给定的 key 是否已经在注册表中了。假如是,则会直接返回上次存储的那个。否则,Symbol.for()会再新建一个。

// 将Symbol放到全局注册中
let sy1 =Symbol.for('hello');
// 从全局注册表中找到该key对应的value
let sy2=Symbol.for('hello');
console.log(sy1===sy2); //true

//和Symbol比较
let sy3 = Symbol('name')
let sy4 = Symbol('name')
console.log(sy3=== sy4); //false

你可能感兴趣的:(ES6,es6,javascript,前端,ecmascript)