JavaScript中Array数组的map()函数的详解

前言

开发中，经常会用到js的Array数组的各种迭代函数map()，filter()，some()，every()，forEach()，find() findIndex()，也是在ES6中新增一些遍历函数。同样是不是也是一道面试题，说说ES6新增的一些新特性？？？？

✍开始正文map()函数

✍一、对map()函数的定义：

map()：通过指定函数处理数组中的每一个元素，并返回一个处理后的新数组。

✍二、语法

array.map(function(currentValue,index,arr),thisValue)

• map()不会对空数组进行检测

• map()不会改变原始数组
  参数说明：

• function(currentValue, index, arr)：必须，自定义的业务函数，数组中的每一个元素都会执行该函数；
  函数参数详解：
  1、currentValue：必须 当前元素的值
  2、index：可选 当前元素的索引
  3、arr：可选 当前元素属于的数组对象

• thisValue：可选 对象作为该执行回调时使用，传递给函数，用作"this"的值。

✍三、示例

返回原数组中每一个元素的2倍值

	var arrays = [1,3,5,7,9];
	arrays.amp(x => x*2);

运行结果：

✍这里插播ES6的第二个新特性【箭头函数】，就是上述示例的代码，是不简洁干练
ES6标准新增特性之一：Arrow Function(箭头函数)

x => x*x

上述的箭头函数等同于：

function(x){
	return x*x;
}

箭头函数相当于匿名函数，并且简化了函数定义。箭头函数有两种格式，一种像上面描述，只包含一个表达式，连 { … } 和return都省略掉了；第二种格式使用相对复杂一点的多条语句，这时候就不能省略 { … } 和return。

array.map(x =>{
	if(x > 0){
		return true;
	}else{
		return false;
	}
})

如果要返回一个对象，就要注意，如果是单表达式，这么写的话会报错：

// SyntaxError:
x => { foo: x }

因为和函数体的{ … }有语法冲突，所以要改为：

// ok:
x => ({ foo: x })

✍this
箭头函数看上去是匿名函数的一种简写，但实际上，箭头函数和匿名函数有个明显的区别：箭头函数内部的this是词法作用域，由上下文确定。

回顾前面的例子，由于JavaScript函数对this绑定的错误处理，下面的例子无法得到预期结果：

var obj = {
    birth: 1990,
    getAge: function () {
        var b = this.birth; // 1990
        var fn = function () {
            return new Date().getFullYear() - this.birth; // this指向window或undefined
        };
        return fn();
    }
};

现在，箭头函数完全修复了this的指向，this总是指向词法作用域,也就是外层调用者obj：

var obj = {
    birth: 1990,
    getAge: function () {
        var b = this.birth; // 1990
        var fn = () => new Date().getFullYear() - this.birth; // this指向obj对象
        return fn();
    }
};
obj.getAge(); // 25

如果使用箭头函数，以前的那种hack写法：

var that = this;

就不再需要了。

由于this在箭头函数中已经按照词法作用域绑定了，所以，用call()或者apply()调用箭头函数时，无法对this进行绑定，即传入的第一个参数被忽略：

var obj = {
    birth: 1990,
    getAge: function (year) {
        var b = this.birth; // 1990
        var fn = (y) => y - this.birth; // this.birth仍是1990
        return fn.call({birth:2000}, year);
    }
};
obj.getAge(2015); // 25