es6+webpack学习笔记 (+bug)

webpack
1.安装nodejs
2.安装npm install -g webpack

bug:
npm 安装包报错 rollbackFailedOptional

https://blog.csdn.net/qq_34351732/article/details/78705997
npm config rm proxy
npm config rm https-proxy
然后使用npm install -g cnpm –registry=https://registry.npm.taobao.org安装淘宝的cnpm
Css-loader:
js形式
命令行形式
– watch 实时更新 --progress 进度 --display-moudles 显示模块 --display-reason 显示原因
Webpack.config.js 配置：

可以在package.json 配置webpack 命令

然后npm run webpack

Entry 入口：
数组
Entry:[./js/index1.js,./js/index2.js]
对象
Entry:{
Package1:’./js/index.js’,}
Output:

Babel-loader :安装
Npm install --save-dev babel-loader babel-core
Npm install @babel/core --save
Npm install @babel/preset-env --save-dev
使用：

Babel reset— package.json

Bug:

Es6
19/3/4
变量：
Es5:var（全局作用域）
Es6:
let（相当于var）只作用于块级作用域,1 没有预解析。
const(常量定义) object.freeze(对象）。
Const config ={
Host:
test
}

解构赋值：
let a=1,b=2,c=3;
Let [a,b,c]=[1,2,3];
Console.log(a,b,c);

左右两边，结构要保持一致，
Let[a,[b,c]]=[1,[2,3]];
Let json={name:test,age:13,sex:male};
Let {a:a1,b:b1,c:c1}=json;
可以给默认值：
Let {a,b,c=’c’}={‘a’,’b’};
交换赋值：
let a=12;
Let b=2;
Let [a,b]=[b,a];

字符串模板：
Let name=’a‘;
Let sex=’b’;
Let str=”这个人叫$name,性别是${sex}”;

Srt.includes() 返回值：true/false
Navigator.userAgent.includes(‘chrome’) 判断浏览器

str.endwidth()
Str.startwidth()
Str.repeat(次数);

函数的默认参数
Function show({x=0,y=0}={}){
}
Show();
函数默认参数已经定义，不能重复定义
扩展运算符，reset运算符
…
Let arr=[a,b,c];
Console.log(…arr); 数组展开

Let a =Array.prototype.slice.call(arguments); 排序
a.sort();

箭头函数
（）=>return 东西
()=>{
语句
Return
}
this问题，定义函数所在的对象，不在是运行时所在的对象
箭头函数里面没有arguments

6.数组热闹的循环
Arr.foreach(
Function(val,index,arr){}
)
Arr.map((val,index,arr)=>(
Console.log(val,index.arr);
));
非常有用，映射，需要配合return,返回是一个新的数组
Arr.filter();
Arr.some(); 类似查找 符合某个元素就 返回true
Arr.every();

Array.of(‘abc’,’bcd’,’cde’) 把一组值转成数组
Array.from()
Arr.find() 没找到返回undefine
Arr.findindex() 没找到返回-1

Arr.fill(‘填充的东西’,开始位置，结束位置);

object
Object.is(‘nan’,’nan’) 判断两个对象是否相等
Let js={a:1};
Let js2={b:1,a:2};
Let js3={c:1};

Object.assign({},json,json2,json3) 1.复制一个对象2.用来合并对象

For(let key of object.keys(js2)){
Console.log(key);
}
Let item of entries(json)

9.Promise
作用：解决异步回调问题
Let promise=new promise(function(resolve,reject){
If(a==10){
Resolve(‘成功’);
}else{
reject(‘失败’);

}
});
Promise.then(res=>{
Console.log(res);
},error=>{
Console.log(err);
}).catch(){};

Promise.resolve(“aaa”); 将东西转换成一个resolve状态的promise对象
Promise.reject(“bb”);
Promise.all([p1,p2,p3]).then(res=>{}) 三个必须为成功状态
Promise.race([p1,p2,p3]) 只要一个成功就行

模块化
Export const a=1;
Export const b=2;
Export const c=3;

Export {
A as a,b as ba,} 语法二

Export default

Import {a,b,c} from ‘./moudles/1.js’;
1写在任何位置，会自动提升顶部
2导出去模块内容，如果里面有定时器更改，外面也会改动
3import只会导入一次。
4.不可写到if语句里
Import * as modto from ‘./moudles/1.js’
动态引入，是个promise对象类似于nodejs:
Import(‘js文件’).then(res=>{ })

类和继承
Const person= class{
Constructor(){
}
aaa{ 方法名可以为变量
}
}

静态方法
Class person{
Static show(){
}}
Person.show(); 可直接调用

继承
Super(arug); 继承父类的属性
Super.方法名（）; 继承父类的方法

12.symbol&generator
generator函数
解决异步，深度嵌套问题 async()
语法：
Function * gen(){
Yield ‘welcome’;
Yield ‘to’;
Return ‘test’;
}
Let g1=gen();
Console.log(g1.next()); //{value:’welcome’,done:false}
遍历
For (let val of g1 ){
Console.log(val);}
解构：
Let [a,b]=gen();
…gen();

文件读写系统

promise方式

Generator方式

async方式

1await后面可以是promise对象，也可以是数字、字符
2Async 函数返回也是promise对象
3只要一个状态为reject,后面中断执行（try{}catch{}解决）

13.set数据结构
Let setarr=new set(‘1’,’3’,’4’); 类似数组，但不能用重复值
Set.add() 添加
Set.delete 删除
Set.has() 是否有值
Set.size()
Set.clear()

new weakset({}) 存储json数据

Map
Map.set(key, value) key可以为任意类型
Map.get(key)
Map.delete()
Map.has()
Map.clear()

Weakmap key只能是对象

16.数字变化 和math新增的东西
二进制：
let a =0b101010
八进制
Let a =0o666

Number.isfinite(a) 判断是不是数字
Number.isnan()
Number.isinteger() 判断是不是整数
安全整数：
-(2^53)-1 到2^53-1
Number.isSafeinteger()

Math.trunc(4.55) 保留整数
Math.sign() 判断是否正数 ,正为1，负为-1,0为0
Math.cbrt() 计算一个数的立方根

取年月日

命名捕获
/(?\d)-(?{2})/