ES6

106 阅读1分钟
  1. let 和 const

// bad var foo = 'bar';

// good let foo = 'bar';

// better const foo = 'bar'; 复制代码2. 模板字符串

  1. 模板字符串 需要拼接字符串的时候尽量改成使用模板字符串: // 例子 2-1

// bad const foo = 'this is a' + example;

// good const foo = this is a ${example}; 复制代码2. 标签模板 可以借助标签模板优化书写方式: // 例子 2-2

let url = oneLine www.taobao.com/example/index.html ?foo=${foo} &bar=${bar};

console.log(url); // www.taobao.com/example/index.html?foo=foo&bar=bar 复制代码oneLine 的源码可以参考 《ES6 系列之模板字符串》 3. 箭头函数 优先使用箭头函数,不过以下几种情况避免使用:

  1. 使用箭头函数定义对象的方法 // 例子 3-1

// bad let foo = { value: 1, getValue: () => console.log(this.value) }

foo.getValue(); // undefined

forEach arr.forEach(function(ele,index){ ele指arr数组的每一位的值,index指数组每一位的索引值 })

源码:

Array.prototype.myForEach = function (func) {
    var len = this.length;
    for (var i;i < len;i++) {
        func(this[i],i)
    }
}

filter var newArr = arr.filter(function (ele, index) { ele指arr数组的每一位的值,index指数组每一位的索引值 循环结果是true那么将 ele 赋值给 newArr })

源码:

Array.prototype.myFilter = function (func) {
    var arr = [],
        len = this.length;
    for( var i; i < len; i++){
        if(func(this[i], i)){    //当回调函数执行的结果为true时,才push当前数组的值给返回的数组
            arr.push(this[i]);
        }
    }
    return newArr;
}

map var newArr = arr.map(function (ele, index) { //每次回调函数执行时,回调函数return的结果是什么,便push给newArr什么 })

源码:

Array.prototype.myMap = function (func) {
    var len = this.length,
        arr = [];
    for (var i; i < len; i++) {
        push(func(this[i], i))
  }
    return arr;

}

reduce var newArr = arr.reduce(function (prevValue, ele, index) { return prevValue + ele //第一次执行时prevValue等于FirstValue,当FirstValue没传入时,prevValue等于arr[0],同时index++ //从第二次回调函数执行后prevValue等于上一次回调函数执行的结果,所以使用时要将函数的结果进行return },FirstValue)

源码:

Array.prototype.myReduce = function (func, init) {
    var previous = init,
    len = this.length,
    i = 0;
    if (init == undefined) {
        previous = this[0];
        i = 1;
    }
    for (var i; i < len; i++) {
        previous = func(previous, this[i], i)
    }
    return previous;
}