JavaScript 箭头函数

x => x * x ;

相当于：

function (x) { return x * x; }

 

那么：

var fn = x => x * x ;

相当于：

var fn = function(x){ return x*x; }

 

箭头函数相当于匿名函数（有区别），并且简化了函数定义。

箭头函数有两种格式：

一种像上面的，只包含一个表达式，连{ ... }和return都省略掉了。

还有一种可以包含多条语句，这时候就不能省略{ ... }和 return 。

 

=> 前面是匿名函数的 参数

=> 后面是匿名函数的函数体

 

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

 

// 普通 this

var obj = {
    birth: 1990,
    getAge: function () {
        var b = this.birth; // 1990 this指向obj对象
        var fn = function () {
            return new Date().getFullYear() - this.birth; // this指向window或undefined（因为在匿名函数的内部函数中）
        };
        return fn();
    }
};

// 箭头函数this

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