• 首页
  • vue
  • TypeScript
  • JavaScript
  • scss
  • css3
  • html5
  • php
  • MySQL
  • redis
  • jQuery
  • ECMAScript 2016(ES7)新特性

    ECMAScript 2016(ES7)新特性:

    • 指数运算符:**
    • Array.prototype.includes()
    • 函数作用域中严格模式的变更。


    指数(求幂)操作符

    在之前的时候,可以通过Math.pow()方法来执行求幂运算,但这毕竟是一个方法,一些开发者更希望通过操作符就可以实现这个功能。所以在ES6中,使用了两个星号**,来作为求幂运算符。其中:左操作数是基数,右操作数是指数。

    3 ** 2 //9
    
    效果同
    Math.pow(3, 2) //9
    

    由于是运算符,也可以**=

    var b = 3;
    b **= 2;
    console.log(b); //9
    

    求幂运算符在 JavaScript 所有二进制运算符中具有最高的优先级(一元运算符的优先级高于**)。

    let result = 2 * 5 ** 2;
    console.log(result); // 50
     


    Array.prototype.includes()

    ES7 为 Array 添加了新的方法includes(),查找一个值在不在数组里,若是存在则返回true,不存在返回false

    Array.prototype.includes(element, start = 0)
    
    • element:要查找的元素。
    • start:开始查找的位置。如果start参数小于 0,则重置为 0,如果start参数大于等于数组长度,则返回 false。
    const arr=['a', 'b', 'c'];
    arr.includes('a') // true
    arr.includes('d') // false
    
    arr.includes('b') // true
    arr.includes('b',1) // true
    arr.includes('b',2) // false
    

    该方法与indexOf()的区别在于,indexOf()不会识别NaN和稀疏数组中的缺失元素。而includes()方法可以。

    var array = [1,2,3];
    array.length = 5;
    array.push(NaN);
    array; // [1, 2, 3, empty × 2, NaN]
    
    array.includes(undefined);  // true
    array.includes(NaN);        // true
    
    array.indexOf(undefined);   // -1
    array.indexOf(NaN);         // -1
    


    函数作用域严格模式的一处改动

    函数中存在use strict时,实现运行在严格模式下的参数非常困难,因为参数默认值也可以是函数。这个难点导致大多数 JavaScript 引擎均不实现此功能,而是将其等同于全局对象。

    由于实现困难,ES2016规定在参数被解构或有默认参数的函数中,禁止使用use strict指令。只有参数为不包含解构或默认值的简单参数列表时,才可以在函数体中使用use strict

    //此处使用简单参数列表,可以运行
     function okay(first, second)
     {
         "use strict";
         return first;
     }
     
    //抛出语法错误
     function notOkay1(first, second=first)
     {
         "use strict";
         return first;
     }
     
    //抛出语法错误
     function notOkay2({ first, second })
     {
         "use strict";
         return first;
     }
    
     
    //函数执行,先执行函数参数,再函数体
    //在函数体中定义 "use strict",只有在函数体中才能知道参数是否应该严格模式。但是参数却应该先于函数体的执行
    
    //解决方案一 设定全局严格模式
    //解决方案二,将函数包在一个无参数的立即执行函数内
    const fun = (
        function () {
            "use strict"
            return function (value = 100) {
                return value;
            }
        }()
    )
    
    console.log(fun(50))
    
    <script>
    'use strict';
    
    // 1. 变量名必须先声明再使用
    // num = 10;
    // console.log(num);  //严格模式下报错
    var num = 10;
    console.log(num);
     
     
    // 2.不能随意删除已经声明好的变量,会报错
    // delete num;
     
     
    // 3. 严格模式下全局作用域中函数中的 this 指向 undefined,不再是window
    function fn() {
        console.log(this); // undefined。
     
    }
    fn();
     
     
    // 4. 严格模式下,如果 构造函数不加 new 调用, this 指向的是 undefined 如果给他赋值则 会报错.
    function Star() {
        this.sex = '男';
    }
    Star();
    var ldh = new Star();
    console.log(ldh.sex);
     
     
    // 5. 定时器 this 还是指向 window 
    setTimeout(function() {
        console.log(this); 
    }, 2000);
    a = 1;
    a = 2;
     
     
    6. 严格模式下函数里面的参数不允许有重名
    function fn(a, a) {
        console.log(a + a);
    };
    fn(1, 2);
    function fn() {}
    </script>