学习ES6

es6

闭包是js的变量，它里面是没有块作用域的情况下，它的一个临时的解决方案。一旦有了块级作用域，就不需要闭包了；
js中的var -----函数块（函数内）----重复声明、不能控制修改

es6中的let-------块级（代码块）-----不重复声明、能控制修改
解构赋值：适合从一个大的结构去取数据

例子：用在json中：json={a:12,b=5};

let {a,b}=json;

数组： arr=[12,5,8];

let [a,b,c]=arr
箭头函数:function不要，中间加箭头。简写（作用一）
- 有且仅有一个参数，()也可以不写。
- 有且仅有一个语句并且是return,{}也可以不写。
- 可以修正this.固定this(作用二)
...(三个点)--------作用：参数收集与展开、数组展开、json展开
1. 原生对象扩展：
  
  map------映射，--对应。[34,67]=>[不及格，及格]
  
  reduce----m=>1------购物车的总金额
  
  filter
  
  forEach
1. json对象：
  
  JSON.stringify{{a:5,b:68}} => "{"a":5,"b":68}" json变为字符串
  
  JSON.parse(与上面相反)
2. babel的作用：使得ES6转为ES5，兼容IE6以下的浏览器。
3. babel引入方法：1.在线：引入babelser文件，改text/babel------会有延迟，受限
  
  2.无限编译
  
  步骤：1. 创建一个新项目
  1. 进入项目地址打开终端
  2. npm init -y
  3. cnpm i @babel/core @babel/cli @babel/preset-env -D
    
    @babel/core(bebal的核心库) @babel/cli(命令库) @babel/preset-env (环境预设)
  4. 在package.json里“scripts”下添加自己的命令其中 -d 就是输出的目标地址
    
    创建一个配置文件.bebalrc是为了声明我用的是哪个预设。然后直接npm run build
1. src和dest目录都可以自己创建。
bebal使用成功！

在更老一些的浏览器不支持es6的话，可以添加一条语句：npm i @bebal/polyfill(一种行为：填充)；

它会检测你浏览器的版本，如果特别低，它会把自己的库给浏览器，使得编译成功。

写es6代码，引入es6编译后的js文件。
1. 异步操作-ajax
  - ajax("地址"，回调函数（）{});-------异步操作
  - 异步操作---用户体验好，同时进行多个操作。（用户输入完之后可以立刻检查用户名是否已占用，直接反馈。用户可以在系统检查的时候填写下方的信息），但是由于写回调函数的原因，使得代码太混乱。
  - 为了有异步的功能，同步的简单，防止回调地狱，融合异同步-------Promise、async/await
  - Promise---只是对异步做一个封装（它不能算是异步操作的处理）
  - Promise.all([
    
    p1,
    
    p2,
    
    p3,
    
    ...
    
    ]).then
    
    (同时读取多个文件，需要三个文件同时成功才行，是与的关系)
  - Promise.race------竞速（是或的关系）
  使用Promise.all来避免很深的嵌套。
  1. 面向对象
  - es5构造函数和类分不清
  - es5的继承
  - es6的继承
  es6中多了：class ----类声明、constructor----构造函数、entends----继承、super----超类
  
  有子类，有专门声明关系的entends，也有super，通过这个可以把参数传进去，自动的把数继承过来；
  
  有关方法继承，原来的需要prototype，然后new一个父类的实例仍在身上，并且要顺带constructor的属性给修正过来。
2. 模块系统
- es6的模块浏览器不支持，需要经过编译---webpack
  
  步骤：1，导出export（一个变量，一堆变量）
  
  export let a=3;
  
  let a,b,c=....;
  
  export(a,b,c,...);
  
  export function show(){};
  
  export class Person{}
  
  export default 99;
  
  2,导入import（函数，class）
  
  import * as mod1 form "xxx";-----------引入所有成员
  
  import mod1 form "xxx";---------------------引入默认成员
  
  import (a,b) from "xxx";
  
  只引入------import "xxx";
  
  异步引入------let p=import("./mod1");-----简化代码，推荐
  
  3,webpack编译---在终端
1. 幂操作(ES7)----**代替pow
1. (ES7) arr.includes( )---检测是否存在
2. (ES8) async/await
3. (ES9) rest/spread(也是用来消除异步操作的，目前未成熟)、异步迭代、Promise.all/race/finally

学习ES6

es6

异步操作-ajax

面向对象

模块系统