ES6（ECMAScript2015）(一)

一.变量

let:声明变量
const：声明常量
1.禁止重复声明
2.块级作用域，之前var只支持全局变量和函数作用域，es6语法块
  <script type="text/javascript">
        {
            let a = 0;
        }
        alert(a)  //Uncaught ReferenceError: a is not defined
    </script>
3.限制修改:之前只有var，ES6区分let和const

二.解构赋值

• 1.左右两边数据结构得一致
• 2.右边必须是个数据结构，一般是数组/json

三.函数

• 1.箭头函数，本质上就是一个简写

  (参数)=>{
      //函数体
  }
  

  修复this指向：

  this是绑定在当前环境下的，json是在window下声明的
   <script type="text/javascript">
      let json = {
          a: 2,
          b: 4,
          show: function() {
              console.log(this);  //this指向document，因为下面进行了赋值
              alert(this.a + this.b);
          }
      }
      document.onclick = json.show;
  </script>
  改造成箭头函数，this就会指向当前对象
   <script type="text/javascript">
      let json = {
          a: 2,
          b: 4,
          show: ()=> {
              console.log(this);  //window
              alert(this.a + this.b);
          }
      }
      document.onclick = json.show;
  </script>
  

• 2.参数展开

收集剩余参数，剩余参数必须要在最后一个

  <script type="text/javascript">
        function show(a, b, ...rest) {
            console.log(rest)
        }
        show(1, 2, 3, 3, 33)
    </script>

展开数组

 <script type="text/javascript">
        let arr = [1, 4, 5, 7];
        function sum(a, b, c, d) {
            return a + b + c + d;
        }
        console.log(sum(...arr))
    </script>

四.系统对象

• Array

    1.map  (item,index) 遍历  返回新数组，不会改变旧数组
    2.forEach  循环
    3.filter 过滤 
    4.reduce

• String

1.字符串模板 `${param}`
2.startsWith  endsWidth

• JSON

五.异步处理(回调地狱)

• Promise
• Async/Await

六.兼容

• babel进行编译,需要在node.js里面运行 www.babeljs.cn/setup#brows…
• 最新版需要安装三个包 @babel/core @babel/cli @babel/present-env

项目根目录下 .babelrc文件
{
  "presets": ["@babel/preset-env"]
}

版本

ES6(ECMA 2015)

ES7(ECMA 2016)
** 求幂 12**5    12的5次方
Array.includs()

ES8(ECMA 2017)
async/await

ES9(ECMA 2018)
rest/apread
异步迭代
Promise.finally()
正则表达式的加强