什么是箭头函数

箭头函数是随着ES6的发布而出现的，其作用在于大大简化JS函数的写法，使得JS代码变得非常简洁。箭头函数的标准写法如下：

let myFun = (name) => {
    // body
    return `Hi! ${name}`;
};

这其实对应于ES5的函数写法：

var myFun = function(name){
    // body
    return "Hi! " + name;
}

箭头函数没有函数关键字function，取而代之的是=>箭头，函数的参数放在箭头的括号中，如果参数只有一个，可以省略括号，如果没有参数，则需要写空括号。箭头函数的函数体位于箭头的后面。对于函数体，如果只有一句简单的返回语句，则可以省略外面的大括号。如果箭头函数的函数体只有一句，且是返回一个对象，则可以用小括号包裹该对象，无需使用大括号，不过个人觉得这很鸡肋。形式如下：

let test = id => ({id: '0001', name: 'John'});

对于函数体的特殊情形，最后一种就是只有一条语句且不需要返回值，这时需要在语句前面加上void关键字，其实本质就是调用了另一个函数，类似于闭包哦，比如说像下面这样：

let test = () => void noReturn();

看了这么多箭头函数的情形，那么箭头函数究竟有什么用呢？其实简单的说，箭头函数主要是为了简化回调函数而引入的，JS中的回调函数非常常见，如果每次使用回调函数都需要写标准的ES5格式，代码会非常繁琐冗余。下面看下例子：

//普通写法
[1,2,3].map(function(i){
    return i*i;
});

//箭头函数写法
[1,2,3].map(i => return i*i);

所以说，箭头函数对于写回调函数非常友好。

箭头函数和普通函数的区别点

说明了箭头函数的写法，下面我们开始总结箭头函数和普通函数的区别点，这就是前端面试经常被问到的面试题。

语法更加清晰简单

从上面的说明来看，写箭头函数明显更加简洁清晰。

箭头函数不会创建自己的this

这个特性非常非常非常重要！我们一定要牢记，箭头函数没有自己的this指针，它的this是从自己的作用域链的上一层继承过来的。并且，箭头函数继承的是函数定义时的外层执行环境的this，并且这个this之后不会改变指向！

箭头函数的this指针指向永远不变

call() apply() bind()都不能改变箭头函数this的指向

以上三个方法都可以动态改变函数执行时的this指向，但是它们再厉害也不能改变箭头函数的this指向。

箭头函数不能作为构造函数

因为箭头函数没有自己的this且它继承过来的this指向无法被改变，所以当使用构造函数new一个对象实例时无法将this指针指向该实例，所以一定会报错。

箭头函数没有原型prototype

所有Function都有原型，但是箭头函数作为特殊的函数，没有原型prototype，这一点需要记住。

箭头函数没有自己的arguments

这一点和没有自己的this一样，也是继承的其外部的执行环境中的值。