重学TS --- ts中的symbol

378 阅读2分钟

Symbol

小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。

Symbol是ES6新增的基本数据类型,表示的是一种独一无二的值

/*
    在TS中,默认情况下不可以使用Symbol这类ES6方法
    如果需要使用,需要在tsconfig.json中进行配置
    "lib": [
      "ES6" // 或 "ES2021"
    ]
*/
const s1 = Symbol()
// 创建Symbol值的时候,只要使用Symbol方法进行创建即可,不需要使用new关键字
const s2 = Symbol()

console.log(s1) // => Symbol()

// 因为这个式子永远打印的值都是false,所以在ts中,下面这一行是会警告的
console.log(s1 === s2) // => false
const s1 = Symbol('foo')
const s2 = Symbol('foo')

console.log(s1) // => Symbol(foo)
console.log(s1 === s2) // error 等式恒为false
// 在TS中,Symbol方法的参数的类型为 string | number
const s1 = Symbol(123)
const s2 = Symbol('Klaus')

// 在js中,Symbol的标识符会被转换为字符串类型
// 所以在js中Symbol({ key: 'value' }) ---> Symbol('[object Object]')
const s3 = Symbol({ key: 'value' }) // error 参数类型不支持
const s = Symbol()

// 无论在js还是在ts中,Symbol不可以和任何的数据进行运算操作
console.log(s + 1) // error
// Symbol可以转化为字符串或Boolean类型的值
const s = Symbol()

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

Symbol值可以作为对象的属性名,但是只能使用方括号语法来获取key为Symbol类型的值

const key = Symbol('key')

// 设置值
const obj = {
  [key]: 'value'
}

// 取值
console.log(obj[key])

遍历取Symbol值

const key = Symbol('key')

// 设置值
const obj = {
  name: 'Klaus',
  [key]: 'value'
}

// 以下方式遍历,是取不到Symbol类型的值的
for (const key in obj) {
  console.log(key) // => name
}

console.log(Object.keys(obj)) // => [ 'name' ]

console.log(Object.getOwnPropertyNames(obj)) // => [ 'name' ]

console.log(JSON.stringify(obj)) // => {"name":"Klaus"}

// 以下方式,可以获取到Symbol类型对应的属性值
console.log(Object.getOwnPropertySymbols(obj)) // => [ Symbol(key) ]

console.log(Reflect.ownKeys(obj)) // => [ 'name', Symbol(key) ]

Symbol.forSymbol.keyFor

const s1 = Symbol()
const s2 = Symbol()

// console.log(s1 === s2) // => error 恒为false

const s3: symbol = Symbol.for('foo')
const s4: symbol = Symbol.for('foo')

// Symbol.fo会去全局查找是否已经存在对应标识符对应的symbol值
// 如果存在,直接返回,如果不存在,则新建一个symbol值
console.log(s3 === s4) // => true

获取标识符

const s1 = Symbol('foo')
console.log(s1.description) // => foo
console.log(Symbol.keyFor(s1)) // => undefined

const s2 = Symbol.for('foo')
console.log(Symbol.keyFor(s2)) // => foo

const s3 = Symbol.for() // error TS中要求Symbol.for必须传递一个标识作为参数
console.log(Symbol.keyFor(s3)) // 在js中返回 'undefined'