我的es6总结

发布时间:2019-08-09 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了我的es6总结脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

一. es6编译环境搭建

1 . 初始化 npm 创建package.json文件

    npm inIT

2. 安装webpack

    cnpm install webpack -D

3. 安装babel相关包来编译es6 语法

    cnpm install babel-loader babel-core babel-PReset-es2015 -D

二、 写webpack.config.js配置文件,配置编译es6

1. loader相关配置

        module.exports = {
            entry:'./entry.js',
            output:{
                filename:'./bundle.js'
            },
            module:{
                loaders:[
                    {
                        @R_406_2187@:/.js$/,
                        loader:'babel-loader',
                        exclude:/node_modules/
                    }
                ]
            }
        }

2. 创建.babelrc配置文件

        {
            "presets": ["es2015"]
        }

三、es6的遍厉和...替代anguments

1 遍厉对象和替代anguments

{
     function test3(...arg){
         for(let v of arg){
             console.LOG("rest",v);
         }
     }
     test3(1,2,3,4,5,"a");
 }

2. es6的遍厉对象,Object.entries

 {
     let test ={x:1,y:456};
          for(let [key,value] of Object.entries(test)){
              console.log([key,value]);
          }
 }

四、类的继承class

补充:普通方法是实例化出来的对象,静态方法属于类,亦可以被继承。

1.类的基本定义生成实例

{
    class PErson{
        //构造函数。
        constructor(name = "laozhou"){ //默认值:laozhou
            this.name = name;
        }
    }
    let p1 = new Person("小王"); //new的时候自动执行构造函数。
    console.log("构造函数和实例",p1);
}

2.继承

extends 继承
super   上一级,可以调用父类的构造函数。
{
    class Father {
        constructor(name="侯瑞强",sex="男") {
            this.name = name;
            this.sex = sex;
        }
    }
    class Child extends Father {
        constructor(name="child",sex) { //把父类的本事拿了过来。
            super(name,sex);     //调用父类的构造函数。super必须在第一行,否则报错。
            this.age = 10;
        }
    }
    console.log("子类覆盖父类属性的实例",new Child());
}

3.静态属性

{
    class Person {
        constructor(name="默认") {
            this.name = name;
        }
    }
    //静态属性的定义,是直接给类下的属性赋值,该属性就是静态属性,类名点什么直接定义
    Person.type = "text"; //type就是静态属性。
    console.log(Person.type);
}

五、模块化

1.导出exprot,导入import

导出

export default{
    a:1,
    b:2,
    say(){
        console.log("i can say");
    }
}

导入

import Model2 From "./module2.js";
console.log(Model2);

六、 尾调用

一个函数执行,执行到最后的时候调用了另一个函数。
function go(callback){
    console.log(1231313);
    console.log("vvv");
    callback && callback();
}
function tail(){
    console.log(123131313);
}
go(tail);

脚本宝典总结

以上是脚本宝典为你收集整理的我的es6总结全部内容,希望文章能够帮你解决我的es6总结所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。