ES6总结

历史介绍

1. ECMAScript是ECMA组织编写的一个标准，JavaScript实现了ECMAScript。
2. ECMAScript简称ECMA或者ES

兼容性

因为ES6的出现晚于各大浏览器的出现时间，所以兼容性并不好

• ES6大部分支持：IE10，Chrome，FireFox，移动端，NodeJS
• 解决ES6兼容性的两种方法：
  1. 在线转化
  2. 提前编译

目录

1. 变量
2. 函数
3. 数组
4. 字符串
5. 面向对象
6. Promise
7. generator
8. 模块化

1.变量

var

1. 可以重复声明

   var a = 10;
   var a = 2;
   alert(a);//提示2
   

2. 无法限制修改
   • 比如没有常量的概念
3. 没有块级作用域

let和const

1. let和const不能重复声明
2. let定义出来的是变量，可以修改
3. const定义的是常量，不可以修改
4. let和const是块级作用域

2.函数

1. 箭头函数

   1. 如果只有一个参数，（）可以省略
   2. 如果只有一个return，{}可以省略

   实例：
   
   window.onload=function (){
       alert("加载完成");
   }
   
   window.onload=()=>{
       alert("加载完成");
   }
   
   1. 如果只有一个参数
   window.onload=function (a){
       alert("加载完成");
   }
   
   等同于
   
   window.onload=a=>{
       alert("加载完成");
   }
   
   2. 如果只有一个return
   window.onload=function (){
       return "life";
   }
   
   window.onload=()=>"life";
   
   

   箭头函数只是一个简写，可以完全不用

2. 函数的参数

   1. 参数的扩展/展开

   show(a,b)=>{
       alert(a);
       alert(b);
   }
   
   show(12,5,9,5);
   
   //上面的情况，浏览器只会弹出两个数，即a和b
   
   show(a,b,...arges)=>{
       alert(a);
       alert(b);
       //arges
   }
   
   show(12,5,5,6);
   
   //对参数进行扩展之后，传入的前两个参数会被分别赋值给a和b，剩下的会被存入arges中，arges可以是其他任意名称。
   

   2. 展开数组

   let arr=[1,2,3,4];
   
   //...arr
   
   等价于遍历数组
   1，2，3，4
   

   3. 默认参数

   function show(a,b,c){
       alert(a+b+c);
   }
   
   show(1,2,3);// 6
   
   //默认参数
   
   function show(a,b=3,c=6){
       alert(a+b+c);
   }
   
   show(1);// 10
   
   

解构赋值

前提：

1. 左右两边结构必须一样
2. 右边必须是个东西
3. 声明和赋值不能分开，必须在一个语句中完成

实例：
```
let arr=[1,2,3]

let a = arr[1]
let b = arr[2]
let c = arr[3]

//解构赋值

let [a,b,c] = [1,2,3]


```

数组

1. map 映射

   对数组中的元素进行特性的操作，返回对应的数组

   let arr = [11,22,33]
   
   let result = arr.map(function (item){
       return item*2;
   });
   
   //其中item表示的本轮循环中取到的元素
   

2. reduce 汇总

   let arr = [1,2,3,4,5]
   let result = arr.reduce(function (tmp,item,index){
       return tmp+item;
   })
   
   /* tmp：第一轮存储的是数组中的第一个元素，以后存储的都是上一次的返回值
    * item：表示本轮循环取到的值
    * index：当前的下标，默认从1开始
    */
   

3. filter 过滤器

   let arr = [1,2,3,4,5]
   let result = arr.filter(function (item){
       return item%3 == 0 ? true:false;
   })
   
   //根据返回值判断是否要留
   

4. forEach 迭代

   let arr = [1,2,3,4,5]
   let result = arr.forEach(function (item,index){
       alert(item);
   });
   

字符串

1. startWith

   let arr = 'adsfsdagafd'
   arr.startWith('a');
   

2. endWith

   let arr = 'adsfsdagafd'
   arr.endWith('a');
   

3. 字符串模板

   `:返单引号
   `<h1>${tilte}</h1>`
   
   等同于
   '<h1>'+title+'</h1>''
   
   

面向对象

1. 定义一个类

   class User{
       constructor(name,pass){
           this.name=name;
           this.pass=pass;
       }
       
       showName{
           alert(this.nmae);
       }
       
       showPass{
           alert(this.pass);
       }
   }
   
   var u = new User('blue','123456');
   
   u.showName();