TypeScript(四) Symbol-ES6 新基础类型

Symbol-ES6 新基础类型

概述

Symbol 是 ES6 新增的一种数据类型,它和 number,string,boolean,null,undefined,object 一样.它用来表示独一无二的值,通过 Symbol 函数生成

介绍

• 我们使用 Symbol 函数生成一个 symbol 类型的值 s

const s = Symbol()
typeof s //结果symbol

注意 Symbol 前面不能加 new 关键字,直接调用即可创建一个独一无二的 symbol 类型的值

• 我们也可以创建 symbol 类型的时候传入一个参数,这个参数需要是字符串,如果传入的不是字符串,它会优先调用 toString 方法转为字符串

const s1 = Symbol('lison')
const s2 = Symbol('lison')
console.log(s1 === s2)
// false

上述例子中使用 Symbol 方法创建了两个 symbol 值,方法都传入了相同的字符串”lison”,但是 s1===s2 却是 false.所以说明 Symbol 会返回一个独一无二的值,这个值和任何值都不等

• 可以简单理解为 Symbol 值为字符串类型的值,但是它不可以和其他类型的值进行运算,但是可以传为字符串和布尔类型

let s1 = Symbol('lision')
console.log(s1.toString())
// 'Symbol(lision)'

转化

let s = Symbol('lison')
console.log(s.toString())
// 'Symbol(lison)'
console.log(Boolean(s)) //true
console.log(!s) //false

作为属性名

在 ES6 中你可以使用一个变量作为属性名,但是表达式必须放到方括号里

let prop = 'name'
let obj = {
  [prop]: 'Lison'
}
console.log(obj.name)

• 而 Symbol 值可以作为属性名,因为 Symbol 值是独一无二的所以当它作为属性名的时候不会和其他任何属性名重复

let name = Symbol()
let obj = {
  [name]: 'lison'
}
console.log(obj)
// {Symbol():'lison'}

这个时候打出来的对象有一个属性名是 symbol 值,我们如果想访问这个属性值,就只能用 name，必须加[]

console.log(obj[name]) // 'lison'
console.log(obj.name)
// undefined

后面学到 ES6 的类(Class)的时候,会利用此特性实现私有属性和私有方法

属性名的遍历

使用 Symbol 类型值作为属性名,这个属性不会被 for..in 遍历到,也不会被 Object.keys(),Object.getOwnPropertyNames()、JSON.stringify()获取到

const name = Symbol('name')
const obj = {
  [name]: 'lison',
  age: 18
}
for (const key in obj) {
  console.log(key)
}
// => 'age'
console.log(Object.keys(obj))
// ['age']
console.log(Object.getOwnPropertyNames(obj))
// ['age']
console.log(JSON.stringify(obj))
// '{ "age": 18 }'

我们可以使用 Object.getOwnPropertySymbols 方法获取对象的所有 symbol 类型的属性名,他返回的类型是一个数组

let name = Symbol('name')
const obj = {
  [name]: 'lisa',
  age: 18
}
const SymbolPropNames = Object.getOwnPropertySymbols(obj)
console.log(SymbolPropNames)
// [Symbol(name)]
console.log(obj[SymbolPropNames[0]])
// lisa

也可以使用第二种方法 ES6 提供的 Reflect 对象的静态方法 Reflect.ownKeys，它可以返回所有类型的属性名,Symbol 也会被返回

const name = Symbol('lisa')
const obj = {
  [name]: 'lision',
  age: 18
}
console.log(Reflect.ownKeys(obj))
//['age',Symbol(lisa)]

Symbol.for()和 Symbol.keyFor()

Symbol 包含两个静态方法 for 和 keyFor

1.Symbol.for()

• 我们知道使用 Symbol 方法创建的 symbol 值是独一无二的,每一个值都不和任意其他值相等,而我们使用 Symbol.for 方法的时候 它会检查有没有使用该字符串调用 Symbol.for 方法创建的 Symbol 值，如果有则返回,如果没有则新建

const s1 = Symbol('lisa')
const s2 = Symbol('lisa')
const s3 = Symbol.for('lisa')
const s4 = Symbol.for('lisa')
console.log(s1 === s2) //false 不相等
console.log(s3 === s4) //true 相等

特别注意 使用该方法创建的 symbol 值后会在全局范围进行注册

2.Symbol.keyFor()反转获取到参数

该方法传入了一个 symbol 值,返回该值在全局注册的键名

const sym = Symbol.for('lisa')
console.log(Symbol.keyFor(sym)) //结果就是lisa

总结

• Symbol 独一无二

• Symbol.for()和 Symbol.keyFor()使用