532 es6 Symbol:使用,创建对象属性,内置属性

2.9.1.Symbol 基本使用

ES6 引入了一种新的原始数据类型 Symbol,表示独一无二的值。它是JavaScript 语言的第七种数据类型,是一种类似于字符串的数据类型。
Symbol 特点

  1. Symbol 的值是唯一的,用来解决命名冲突的问题
  2. Symbol 值不能与其他数据进行运算
  3. Symbol 定义 的 对象属 性 不能 使 用 for…in 循 环遍 历 ,但 是可 以 使 用Reflect.ownKeys 来获取对象的所有键名

2.9.2.Symbol 内置值

除了定义自己使用的 Symbol 值以外,ES6 还提供了 11 个内置的 Symbol 值,指向语言内部使用的方法。可以称这些方法为魔术方法,因为它们会在特定的场
景下自动执行。



<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>symbol</title>
</head>

<body>
  <script>
    //创建Symbol
    let s = Symbol();
    console.log(s, typeof s); // Symbol() "symbol"

    let s2 = Symbol('哈哈');
    let s3 = Symbol('哈哈');
    console.log(s2 == s3) // false

    // Symbol.for 创建
    let s4 = Symbol.for('哈哈');
    let s5 = Symbol.for('哈哈');
    console.log(s4 == s5) // true

    // 不能与其他数据进行运算
    // let result = s + 100;
    // let result = s > 100;
    // let result = s + s;

    // USONB  you are so niubility 
    // u  undefined
    // s  string  symbol
    // o  object
    // n  null number
    // b  boolean

  </script>
</body>

</html>

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Symbol 创建对象属性</title>
</head>

<body>
  <script>
    // 向对象中添加方法 up down
    let game = {
      name: '俄罗斯方块',
      up: function () { },
      down: function () { }
    };

    // 声明一个对象
    let methods = {
      up: Symbol(),
      down: Symbol()
    };

    game[methods.up] = function () {
      console.log("我可以改变形状");
    }

    game[methods.down] = function () {
      console.log("我可以快速下降!!");
    }

    console.log(game);

    let youxi = {
      name: "狼人杀",
      [Symbol('say')]: function () {
        console.log("我可以发言")
      },
      [Symbol('zibao')]: function () {
        console.log('我可以自爆');
      }
    }

    console.log(youxi)
  </script>
</body>

</html>

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Symbol内置属性</title>
</head>

<body>
  <script>
    class Person {
      static [Symbol.hasInstance](param) {
        console.log(param);
        console.log("我被用来检测类型了");
        return false;
      }
    }

    let o = {};

    console.log(o instanceof Person);

    const arr = [1, 2, 3];
    const arr2 = [4, 5, 6];
    arr2[Symbol.isConcatSpreadable] = false;
    console.log(arr.concat(arr2));
  </script>
</body>

</html>

posted on 2020-09-13 15:50  冲啊!  阅读(276)  评论(0编辑  收藏  举报

导航