当前位置: 首页 > Web前端 > HTML

我的es6总结

时间:2023-04-02 20:57:40 HTML

一、es6编译环境搭建1、初始化npm创建package.json文件npminit2。安装webpackcnpminstallwebpack-D3。安装babel相关包编译es6语法cnpminstallbabel-loaderbabel-corebabel-preset-es2015-D2.编写webpack.config.js配置文件,配置并编译es61。loader相关配置module.exports={entry:'./entry.js',output:{filename:'./bundle.js'},module:{loaders:[{test:/\.js$/,loader:'babel-loader',exclude:/node_modules/}]}}2.创建一个.babelrc配置文件{"presets":["es2015"]}3.es6的overlayand...替换anguments1覆盖对象并替换anguments{functiontest3(...arg){for(letvofarg){console.log("休息",v);}}test3(1,2,3,4,5,"a");}2。es6通用对象,Object.entries{lettest={x:1,y:456};for(let[key,value]ofObject.entries(test)){console.log([key,value]);}}四、类继承类补充:普通方法是实例化对象,静态方法属于类,也可以被继承。1.类的基本定义生成一个实例{classPerson{//constructor。constructor(name="laozhou"){//默认值:laozhouthis.name=name;}}letp1=newPerson("小王");//新建时自动执行构造函数。console.log("Constructorandinstance",p1);}2.继承extends继承超上层,可以调用父类的构造函数。{classFather{constructor(name="侯瑞强",sex="男"){this.name=name;this.sex=性别;}}classChildextendsFather{constructor(name="child",sex){//把父类的能力接过来。超级(姓名,性别);//调用父类的构造函数。super必须在第一行,否则会报错。这个年龄=10;}}console.log("子类重写父类实例属性",newChild());}3.静态属性{classPerson{constructor(name="default"){this.name=name;}}//静态属性的定义就是直接给类下的属性赋值。该属性为静态属性,直接定义类名。Person.type="文字";console.log(Person.type);}5.模块化1.exportexport,importimportexportexportdefault{a:1,b:2,say(){console.log("icansay");}}导入importModel2from"./module2.js";console.log(Model2);6.最后调用一个函数执行,执行结束再调用另一个函数。函数go(回调){console.log(1231313);console.log("vvv");callback&&callback();}functiontail(){console.log(123131313);}go(tail);