前端学习ES6第二天（P30--）

1.set

<script>
    // //声明一个set
    // let s = new Set();
    // let s2 = new Set();
    // //元素个数s2.size
    // //添加新元素s2.add()
    // //删除元素s2.delete
    // //检测s2.has()
    // //清空s2.clear()
    // //遍历
    // for(let v of s2){
    //     console.log(v);
    // }
    let arr = [1,2,3,4,5,4,3,2,1];
    //去重
    let r = [...new Set(arr)]
    //交集
    let arr2=[4,5,6,5,6];
    let r1 = [...new Set(arr)].filter(item=>{
        let r2 = new Set(arr2);
        if(r2.has(item)){
            return true;

        }else{
            return  false;
        }
    })
    console.log(r1)
    //简化交集
    let r3 = [...new Set(arr)].filter(item=>new Set(arr2).has(item));
    //开集
    let union = [...new Set([...arr,...arr2])];
    console.log(union)
    //差集
    let diff =[...new Set(arr)].filter(item=>!(new Set(arr2).has(item)))

</script>

2.map

<script>
    //声明map
    let m = new Map();
    m.set('name','guigu')//键，值
    m.set('change',function () {
        console.log('nihao')
    });
    let key = {
        school:'gg'
    };
    m.set(key,['1','2','3']);
    //size delete clear
    //get获取
    console.log(m.get('change'))
    //遍历
    for (let v of m){
        console.log(v)
    }
</script>

3.class

<script>
    //  function Phone(brand,price) {
    //      this.brand=brand;
    //      this.price=price;
    //  }
    //  //添加方法
    //  Phone.prototype.call = function () {
    //      console.log('我可以打电话')
    //  }
    //  //实例化对象
    // let Huawei = new Phone('华为',5999);
    //  Huawei.call();
    //  console.log(Huawei);

//ES6
    class Phone{
        constructor(brand,price){//特殊方法，名字不能修改，当使用new加对象就自动执行实例对象的constructor方法
            this.brand=brand;
            this.price=price;
        }
        //必须使用该语法
        call1(){
            console.log('我可以打电话');
        }
    }
    let onePlus = new Phone('1+',1999);
    console.log(onePlus);
</script>

4.getter，setter

5.数值扩展

 二进制0b，八进制0o

Number.isFinite检测是否有限数

Number.isNaN检测是否NaN

Number.parseInt Number.parseFloat字符串转整数

Number.isInteger检测是否整数

Math.trunc将数字的小数部分抹掉

Math.sign判断一个数到底为正数负数还是零

6.对象方法扩展

<script>
    //1.Object.is判断两个值是否完全相等
    console.log(Object.is(NaN,NaN));
    console.log(NaN===NaN);
    //2.Object.assign对象合并,前面有后面没有就不会覆盖，后面会覆盖前面重名的
    const config1 = {
        host:'localhost',
        prot:3306,
        name:'root',
        pass:'root'
    };
    const config2 = {
        host:'baidu.com',
        prot:33060,
        name:'guigu',
        pass:'ilu'
    }
    console.log(Object.assign(config1,config2));
    //3.Object.setPrototypeOf设置原型对象
    const school = {
        name:'gg'
    }
    const cities={
        xiaoqu:['1','2','3']
    }
    Object.setPrototypeOf(school,cities)
    console.log(Object.getPrototypeOf(school))//获取原型对象
</script>

7.模块化

①暴露模块

分别暴露

统一暴露

默认暴露

②引入模块

通用的

import * as m1 from "  "

解构赋值形式,重名时候用别名（as）

import{school,teach} from "  "

import{default as m3} from "  "

简便形式只针对默认暴露

import m3 from "  "

③js模块引入

④模块化转换

babel是一个JavaScript编译器，能够将新的代码转换为浏览器能够识别的语法

*安装工具：babel-cli babel-preset-env browserify（P46）

*通过npx babel 转换

*打包