ES6新特性，箭头函数学习文档

怎样定义

let fn = (x) => {
    return x + 1;
}

它的功能相当于匿名函数：

let fn = function(x){
    return x + 1;
}

简写

这里的简写的前提条件是

1.如果参数不是一个，就用括号括起来

2.如果大括号内包含多条语句，就不能省略 {} return

let fn = x => x + 1

区别

那么箭头函数跟匿名函数的区别在哪里？

1.简化了函数定义

2.this的指向问题，箭头函数的this指向作用域是有上下文决定，而匿名函数中的this指向是函数作用域本身。

举个栗子，先看下什么是作用域

function fn1(){
    this.x = 1;
    this.y  = function(){
        fn2();
    }
    this.z = function(){
        return this.x 
    }
    let fn2 = function (){
        return this.x  
    }
}

var fn = new fn1;
console.log(fn.y()); //undefined 
console.log(fn.z()); //1

因为fu.y() 返回的是一个新的方法，它有属于自己的作用域，所以返回值为undefined，但是fn.z返回的是这个作用域本身的变量，所以有数据。

下面有箭头函数之前对于fn.z()方法的解决方案。

function fn1(){
    var self = this; //把this赋值给一个变量
    this.x = 1;
    this.y  = function(){
        return fn2();
    }
    let fn2 = function (){
        return self.x 
    }
}

var fn = new fn1;
console.log(fn.y()); //1
	

现在来说，可以用箭头函数来解决这个问题，fn2中的this指向是外层调用者fn1的作用域。

function fn1(){
    this.x = 1;
    this.y  = function(){
        return fn2();
    }
    let fn2 = () =>{
        return this.x;//this指向是外层调用者fn1的作用域
    }  
}

var fn = new fn1;
console.log(fn.y());//1