TypeScript (三) Symbol

/**
 * ES6 symbol 独一无二的值  两个Symbol值判断  false
 */

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

 const s2 = Symbol('yp')  //yp 全局symbol的标识
 console.log(s2) // Symbol(yp)


 // symbol 不能做运算

 const s3 = Symbol('yp')
 console.log(s3.toString()) //Symbol(yp)
 console.log(!s3) //false

 let prop = 'name';
 const info = {
     [prop]:'yp'
 }
 console.log(info) //{name: "yp"}



 const s4 = Symbol('name');
 const info2 = {
     [s4]:'yp'
 }
 console.log(info2) //{Symbol(name): "yp"}
 info2[s4] = 'py'
 console.log(info2[s4]) //py
//  info2.s4 = '2'



const s5 = Symbol("age");
const info3 = {
    [s5]:24,
    name:'yp',
    sex:'man'
}
for(const key in info3){
    console.log(key) // name sex   没有s5(symbol值)
}

console.log(Object.keys(info3)) // (2) ["name", "sex"]
console.log(Object.getOwnPropertyNames(info3)) //(2) ["name", "sex"]
console.log(JSON.stringify(info3)) //{"name":"yp","sex":"man"}      //都获取不到symbol值作为的属性名

console.log(Object.getOwnPropertySymbols(info3)) //[Symbol(age)]

console.log(Reflect.ownKeys(info3)) //(3) ["name", "sex", Symbol(age)]


/**
 * Symbol.for() 查找之前有没有某个Symbol值,有就还赋给原先的值，没有就新建  全局
 */

 const s6 = Symbol('yp2');  
 const s7 = Symbol.for("yp2");
//  const s8 = Symbol.for("yp2");
//  console.log(s7=== s8)  // 浏览器运行true

/**
 * Symbol.keyFor() 查找Symbol.for创建的对应全局symbol值的标识
 */
console.log(Symbol.keyFor(s6));//undefinded
console.log(Symbol.keyFor(s7));//yp2


// 内置对象


/**
 * Symbol.hasInstance
 */
let obj1 = {
    [Symbol.hasInstance](otherObj){
        console.log(otherObj)   //{a: "a"}
    }
}
console.log({a:'a'} instanceof <any>obj1) // false

/**
 * Symbol.isConcatSpreadable
 */
let arr =[1,2]
console.log([].concat(arr,[3,4])) // (4) [1, 2, 3, 4] 扁平化

arr[Symbol.isConcatSpreadable] = false;
console.log([].concat(arr,[2,4]))  // (3) [Array(2), 2, 4]

/**
 *  Symbol.species  创建衍生对象
 */

// class C extends Array {  // 浏览器运行
//     getNum(){
//         return 'yp'
//     }
// }
// const c= new C(1,2,4)
// console.log(c)  //C(3) [1, 2, 4]

class C1 extends Array {
    constructor(...args) {
        super(...args)
    }
    getName() {
        return 'yp'
    }
}
const c1 = new C1(1,2,3,4)
const c11 = c1.map(item => item +1)
console.log(c11) // (4) [2, 3, 4, 5]
console.log(c11 instanceof C1)  //false    //浏览器true
console.log(c11 instanceof Array) // true


class C2 extends Array {
    constructor(...args) {
        super(...args)
    }
    static get [Symbol.species] (){
        return Array
    }
    getName() {
        return 'yp'
    }
}
const c2 = new C2(1,2,3,4)
const c22 = c2.map(item => item +1)
console.log(c22) // (4) [2, 3, 4, 5]
console.log(c22 instanceof C2)  //false
console.log(c22 instanceof Array) // true

/**
 * Symbol.match 字符串调用方法
 * 
 * Symbol.replace
 * 
 * Symbol.search
 * 
 * Symbol.split
 */

 let obj3 = {
     [Symbol.match] (string) {
         console.log(string.length)
     },
     [Symbol.split] (string) {
        console.log('split',string.length)
     }
 }
 'abcd'.match(<RegExp>obj3) //4

 'abcde'.split(<any>obj3)


 /**
  * Symbol.iterator 数组 遍历器方法 可改写
  */

  const arr0 = [1,2,3];

  const iterator = arr[Symbol.iterator]()

  console.log(iterator.next()) //{value: 1, done: false}
  console.log(iterator.next()) //{value: 2, done: false}
  console.log(iterator.next()) //{value: undefined, done: true}



   /**
  * Symbol.toPrimitive 转换其他类型
  */

let obj4:unknown = {
    [Symbol.toPrimitive](type){
        console.log(type)
    }
}
const res = (obj4 as number)++ //number

// const res = `abc${obj4}`  deault   //浏览器 string




/**
 * Symbol.toStringTag
 */

let obj5 = {
    [Symbol.toStringTag]:'yp'
}
console.log(obj5.toString()) //[object yp]


/**
 * Symbol.unscopables  哪些方法过滤掉
 */

 const obj6 = {  
     a:'a',
     b:'b'
 }
//  with(abj6){ //浏览器运行
//      console.log(a) //a
//      console.log(b)  //b
//  }

console.log(Array.prototype[Symbol.unscopables]) //{copyWithin: true entries: true fill: true find: true findIndex: trueflat: true flatMap: true includes: true keys: true values: true}