ES6学习笔记二

目录

1. set

2. map

3. class类

4. 构造方法继承

5. class类继承

6. class中getter和setter设置

7. ES6数值扩展

8. ES6对象方法扩展

9. 模块化

10 babel

11 ES7新特性

12 ES8 新特性

---

1. set

ES6提供的新的数据结构。类似于数组，但成员的值是唯一的，集合实现iterator接口。所以可以使用扩展运算符和`for...of...`进行遍历

1） set的声明和api

     //声明set
    let set1=new Set();
    let set2=new Set(['黑猫','白猫','胖猫','瘦猫']);
    //元素个数
    console.log(set2.size)
    //添加元素
    set2.add('橘猫');
    //删除元素
    set2.delete('白猫');
    //检测
    console.log(set2.has('白猫'));
    //清空
    // set2.clear();

    //遍历
    for(let a of set2){
      console.log(a)
    }

2） set实现数组的去重、交集、并集、差集

     //使用set来实现数组的去重、交集、差集、并集
    let arr1=[1,1,1,2,2,4,4,5,5]
    //实现数组的去重
    let result=[...new Set(arr1)];
    console.log(result);

    //实现数组的交集
    let arr2=[2,4,6,7];
    let result2=[...new Set(arr1)].filter(item => new Set(arr2).has(item))
    //去重结果
    console.log(result2)

    //实现数组的差集 求arr1对arr2的差集，结果是1，5
    let result3=[...new Set(arr1)].filter(item => !new Set(arr2).has(item))
    console.log(result3)

    //实现数组的并集
    let result5=new Set([...arr1,...arr2]);
    console.log(result5)

2. map

ES6提供了Map数据结构。类似于对象，是键值对的组合。键值不限于字符串，各种类型的值都可以当键。同样Map也实现了iterator接口，可以使用扩展运算符和`for...of`进行遍历。

map的声明和api

    let m=new Map();
    m.set('name','xiaojiang');
    m.set('change',function () {
      console.log('i am xiaojiang')
    })
    let key={
      school:'霍格沃兹'
    }
    m.set(key,['北京','上海','广州']);
    //大小
    console.log(m.size);
    //删除
    // console.log(m.delete('name'))
    //获取
    console.log(m.get('change'))
    console.log(m.get(key))
    //清空
    // m.clear();
    //遍历
    for(let n of m){
      console.log(n)
    }

3. class类

ES6提供了更接近传统语言的写法，引入了Class (类)这个概念，作为对象的模板。通过class关键字，可以定义类。

基本上，ES6 的class可以看作只是一个语法糖，它的绝大部分功能，ES5 都可以做到，新的class 写法只是让对象原型的写法更加清晰、更像面向对象编程的语法而已。

1） class构造方法

    class Phone{
      //构造方法，名字不能修改
      constructor(brand, price){
        this.brand=brand;
        this.price=price;
      }

      //函数必须以以下语法，不能使用es6对象完整形式
      call(){
        console.log('我可以打电话')
      }

    }
    let onePlus=new Phone('1+',9999)
    console.log(onePlus)

2） 静态成员属于类，不属于实例化对象

    class App{
      static name='youtube'
    }
    let app=new App();
    console.log