ES6中新增的数据类型 Symbol

亦凉 2023-07-17 05:56 79阅读 0赞

在ES6之前，基本数据类型有五种 Undefined、Null、String、Number、Boolean；引用数据类型有一种 Object。但在ES6之后，新增了一种基本数据类型 Symbol。

文章目录

      • Symbol是什么？
      • 有什么特点？
        • 没有字面量的写法
        • 新的数据类型，`typeof`返回的是`symbol`
        • `Symbol`函数得到的符号永远不会相等，不管符号描述是否相同
        • `Symbol`可以作为对象属性名，这种属性名叫符号属性。
        • 符号属性是不可枚举的。
        • 针对获取符号属性名的API
        • 符号类型无法被隐式转换，数学运算，字符串拼接等都不可以
      • Symbol 的API
        • 共享符号 `Symbol.for(“符号描述”)`
        • 返回共享符号的值 `Symbol.keyFor(“符号描述”)`
      • 内置 symbol
        • Symbol.hasInstance 判断对象的构造器
        • `Symbol.isConcatSpreadable` 配置`concat()`方法
        • Symbol.toPrimitive
        • Symbol.toStringTag

Symbol是什么？

Symbol用来表示独一无二的值，创建一个符号。

  1. console.log(Symbol())
  4. // Symbol()

有什么特点？

没有字面量的写法

  1. const syb = Symbol()

新的数据类型，typeof返回的是symbol

  1. console.log(typeof Symbol())
  3. // Symbol

Symbol函数得到的符号永远不会相等，不管符号描述是否相同

  1. const syb1 = Symbol("abc");
  2. const syb2 = Symbol("abc");
  3. console.log(syb1, syb2)
  4. console.log(syb1 === syb2)
  6. // Symbol(abc) Symbol(abc)
  7. // false

Symbol可以作为对象属性名，这种属性名叫符号属性。

  1. const sex = Symbol();
  2. const obj = { 
  3.     name: 'robbit',
  4.     age: 20,
  5.     [sex]: '男'
  6. }
  8. for (var key in obj) { 
  9.     console.log(key)
  10. }
  12. // name age

在这里插入图片描述

符号属性是不可枚举的。

  1. const sex = Symbol();
  2. const obj = { 
  3.     name: 'robbit',
  4.     age: 20,
  5.     [sex]: '男'
  6. }
  8. for (var key in obj) { 
  9.     console.log(key)
  10. }
  12. // name age

针对获取符号属性名的API

  1. const sex = Symbol();
  2. const obj = { 
  3.     name: 'robbit',
  4.     age: 20,
  5.     [sex]: '男'
  6. }
  7. console.log(Object.getOwnPropertySymbols(obj))
  9. // [Symbol()]

符号类型无法被隐式转换，数学运算，字符串拼接等都不可以

  1. const syb = Symbol();
  2. console.log(syb + 10)
  4. // TypeError: Cannot convert a Symbol value to a number

Symbol 的API

共享符号 Symbol.for("符号描述")

如果符号描述相等，则可以得到同一个符号

  1. const syb1 = Symbol.for("abc");
  2. const syb2 = Symbol.for("abc");
  3. console.log(syb1, syb2)
  4. console.log(syb1 === syb2)
  6. // Symbol(abc) Symbol(abc)
  7. // true

返回共享符号的值 Symbol.keyFor("符号描述")

从注册表返回 token 字符串

  1. Symbol.keyFor(Symbol.for("abc"))
  3. // abc

内置 symbol

Symbol.hasInstance 判断对象的构造器

  1. function A() { }
  2. Object.defineProperty(A, Symbol.hasInstance, { 
  3.     value: function(obj) { 
  4.         return false;
  5.     }
  6. })
  7. const obj = new A();
  8. console.log(obj instanceof A)
  10. // false

Symbol.isConcatSpreadable 配置concat()方法

内置的Symbol.isConcatSpreadable符号用于配置某对象作为Array.prototype.concat()方法的参数时是否展开其数组元素。

  1. // 配置前
  2. const arr1 = [1, 2, 3];
  3. const arr2 = [4, 5, 6, 7]
  4. const result = arr1.concat(arr2) //对两个数组拆分链接成新的数组
  5. console.log(result)
  6. // [1, 2, 3, 4, 5, 6, 7]
  8. // 配置后
  9. const arr1 = [1, 2, 3];
  10. const arr2 = [4, 5, 6, 7]
  11. arr2[Symbol.isConcatSpreadable] = false; // 配置
  12. const result = arr1.concat(arr2) 
  13. console.log(result)
  15. // [1, 2, 3, [4, 5, 6, 7, Symbol(Symbol.isConcatSpreadable): false]]

Symbol.toPrimitive

当一个对象转换为对应的原始值时，会调用此函数。

  1. const obj = { 
  2.     a: 1,
  3.     b: 2
  4. }
  6. obj[Symbol.toPrimitive] = function() { 
  7.     return 123
  8. }
  9. console.log(obj + 123)
  11. // 246

Symbol.toStringTag

自己创建的类使用 toString 找不到 toStringTag 属性时只好返回默认的 Object 标签，加上 toStringTag 属性，你的类也会有自定义的类型标签。

  1. class Person { 
  2.     [Symbol.toStringTag] = "Person"
  3. }
  4. const p = new Person()
  5. console.log(p.toString())
  7. // [object Person]

发表评论

表情：
评论列表 （有 0 条评论，79人围观）

还没有评论，来说两句吧...

相关阅读