arrow function

//基本样式,arrow之前是参数，arrow之后是函数体
x => x*x

//相当于下面的匿名函数
function(x){
  return x*x;
}

arrow function的完整表达

//若函数体为多行，则return和{}不能省略
x => {
    if (x > 0) {
        return x * x;
    }
    else {
        return - x * x;
    }
}

//若参数为多个，则参数需要使用（）
// 两个参数:
(x, y) => x * x + y * y

// 无参数:
() => 3.14

// 可变参数:
(x, y, ...rest) => {
    var i, sum = x + y;
    for (i=0; i<rest.length; i++) {
        sum += rest[i];
    }
    return sum;
}

//要返回一个对象，就要注意，如果是单表达式，这么写的话会报错
x => { foo: x } //SyntaxError, 因为和函数体的{ ... }有语法冲突
x => ({ foo: x }) //修正做法

arrow function中this的应用：this总是指向词法作用域，也就是外层调用者obj

//通常javascript写法
var obj = {
    birth: 1990,
    getAge: function () {
        var b = this.birth; // 1990
        var fn = function () {
            return new Date().getFullYear() - this.birth; // this指向window或undefined（'use strict'）
        };
        return fn();
    }
};

//this在arrow function中的应用，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

arrow function中apply和call的应用

//由于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
        //会忽略{birth: 2000}, 变成{birthth: 2000}, {birth: 3000}, {}的结果都是一样
        return fn.call({birth:2000}, year); 
    }
};
obj.getAge(2015); // 25

//若省略call()和apply()中的第一个参数，则会报错NaN
var obj = {
    birth: 1990,
    getAge: function (year) {
        var b = this.birth; // 1990
        var fn = (y) => y - this.birth; // this.birth仍是1990
        //会忽略{birth: 2000}, 变成{birthth: 2000}, {birth: 3000}, {}的结果都是一样
        return fn.call(year); 
    }
};
obj.getAge(2015); // 25