ES6的Set、Map、Promise和类语法

8 set和Map

1>set

ES6 提供了新的数据结构 Set。它类似于数组，但是成员的值都是唯一的，没有重复的值。

Set本身是一个构造函数，用来生成 Set 数据结构。

        const set = new Set();
        // 向set中添加数据
        set.add(10);
        set.add(10);
        set.add(20);
        console.log("set:", set); // set: Set(2) {10, 20}
        const arr = Array.of(10, 10, 20);
        console.log("arr:", arr); // arr: (3) [10, 10, 20]
        // 利用set可以对数组进行去重，将一个数组转换成set
        const set2 = new Set(arr);
        console.log("set2:", set2); // set2: Set(2) {10, 20}
        
		// set集合在遍历时，使用for--of
        for (let i of set2) {
            console.log(i); // 10 20
        }

        // 字符串本身也是数组
        const set3 = new Set("ababcdesa");
        console.log(set3); // Set(6) {'a', 'b', 'c', 'd', 'e', …}
        // 将set变成数组
        const arr1 = [...set3];
        console.log("arr1:", arr1); // arr1: (6) ['a', 'b', 'c', 'd', 'e', 's']
        // 使用数组的join方法，进行拼接
        console.log(arr1.join('')); // abcdes

2>map

JavaScript 的对象（Object），本质上是键值对的集合（Hash 结构），但是传统上只能用字符串当作键,为了解决这个问题，ES6 提供了 Map 数据结构。它类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象）都可以当作键。

        const map = new Map();
        // 向map种添加数据
        map.set('name', '旺财');
        map.set('age', 5);
        // 不允许存在重复的key
        map.set("name", "旺财2");
        console.log("map:", map); // Map(2) {'name' => '旺财2', 'age' => 5}
        // 通过key获取值
        const value = map.get("name");
        console.log(value); // 旺财2

        // clear()：清除map中的所有元素
        //map.clear();
        // 获取map中元素的个数 size
        console.log(map.size); // 2
        // has方法：判断map中是否存在指定的key
        console.log(map.has('age1')); // false

遍历map：

        // 1. forEach遍历 map,获取到的是遍历的值
        map.forEach(item => {
            console.log(`item:${item}`); // item:旺财2 item: 5
        });
        // 2. 获取map中所有的key: map.keys()
        for (let key of map.keys()) {
            console.log(`${key}1--->${map.get(key)}`); // name1--->旺财2 age1--->5

        }
        // 3. 获取map中所有的entries: map.entries()
        for (let [key, value] of map.entries()) {
            console.log(`${key}2--->${value}`); // name2--->旺财2 age2--->5
        }
        // map的键可以是任意类型
        map.set(false, "小明");
        console.log(map); // Map(3) {'name' => '旺财2', 'age' => 5, false => '小明'}

Symbol：ES6 引入了一种新的原始数据类型Symbol，表示独一无二的值

        const a = Symbol();
        const b = Symbol();
        console.log(a === b); // false

        map.set(Symbol(), "abc");
        map.set(Symbol(), "def");
        console.log("map:", map);

        //  Symbol作为键是否可以遍历出来?是。
        for (let item of map) {
            console.log("item", item);
        }

        // 让创建的symbol为同一个值
        const d = Symbol.for('a');
        const e = Symbol.for('a');
        console.log(d === e); // true

9 类语法

        // 类就是自定义构造函数
        // function Dog(name, type) {
        //     this.name = name;
        //     this.type = type;
        // }

        // // 方法：定义在所属构造函数的原型上
        // Dog.prototype.show = function () {
        //     console.log(this.name + "----" + this.type);
        // }

        // 使用es6提供的类语法 ,使用class关键字。抽象的概念
        class Dog {
            // 构造函数，创建对象
            constructor(name, type) {
                this.name = name;
                this.type = type;
            }
            // 方法，定义在原型上的
            show() {
                console.log(this.name + "----" + this.type);
            }
            say() {
                console.log("Hello World1");
            }

            // 静态方法： 该方法不属于具体实例，而是归类所有,通过类名去调用.在方法之前加上static,(就表示该方法不会被实例继承，而是直接通过类来调用)
            static say2() {
                console.log("我是一个静态方法");
            }

        }
        // 静态属性：该属性不属于具体实例，而是归类所有,通过类名去调用.
        Dog.color = "red";

        const dog = new Dog("旺财", "泰迪");
        dog.show();
        const dog2 = new Dog("小虎", "藏獒");
        dog2.show();
        console.log(dog.show === dog2.show);

        console.log(typeof Dog); // function
        console.log(Dog.prototype); // object
        console.log(dog.__proto__ === Dog.prototype) // true

        // 调用静态方法
        Dog.say2(); // 我是一个静态方法
        // 调用静态属性
        console.log(Dog.color); // red

10 promise

Promise 是异步编程的一种解决方案，比传统的解决方案——回调函数和事件——更合理和更强大。

多层回调函数的相互嵌套，就形成了回调地狱。大量代码相互嵌套难以阅读，耦合性太强难以维护，而promise是为了解决地域回调问题而提出的。

Promise异步操作的结果，可以调用resolve和reject回调函数处理。

resolve代表的是回调成功的结果，reject代表的是回调失败的结果。

• promise是一个构造函数
  • 我们可以创建 Promise 的实例 const p = new Promise()
  • new 出来的 Promise 实例对象，代表一个异步操作
• Promise.prototype 上包含一个 .then() 方法
  • 每一次 new Promise() 构造函数得到的实例对象，都可以通过原型链的方式访问到 .then() 方法，例如：p.then()
• .then() 方法用来预先指定成功和失败的回调函数
  • p.then( 成功的回调函数， 失败的回调函数 )
  • 调用 .then() 方法时，成功的回调函数是必选的，失败的回调函数是可选的

在 Promise 的链式操作中如果发生了错误，可以使用 Promise.prototype.catch 方法进行捕获和处理：如果不希望前面的错误导致后续的 .then 无法正常执行，则可以将 .catch 的调用提前。