箭头函数用法

总结加借鉴

语法：

箭头函数的语法很简单，定义自变量，然后是箭头和函数主体。

1、不引入参数：

var sum = () => 1 + 2;
// 等同于：
var sum = function() {    
    return 1 + 2; 
};

2、引入单个参数：

var reflect = value => value;
// 等同于：
var reflect = function(value) {    
    return value;
};

x => x * x
//等同于：
function (x) { 
    return x * x;
}

传一个参数就直接写就好了，不用加小括号。
句，所以也不用加大括号。
函数构造完毕赋给reflect加以引用。

3、引入多个参数，则应加上小括号

var sum = (num1, num2) => num1 + num2;
// 等同于：
var sum = function(num1, num2) {    
    return num1 + num2;
 };

4、若你想使用标准的函数体，或者函数体内可能有更多的语句要执行，则要用大括号将函数体括起来，并明确定义返回值。

var sum = (num1, num2) => { return num1 + num2; }
//等同于：
var sum = function(num1, num2) {    
  return num1 + num2; 
};

大括号内的部分基本等同于传统函数

5、箭头函数若要返回自定义对象的话，就必须用小括号把该对象括起来先

var getTempItem = id = > ({
   id: id,
  name: "Temp"
});
// 等同于:
var getTempItem = function(id) {
  return {
    id: id, 
    name: "Temp"
     };
};

用小括号包含大括号则是对象的定义，而非函数主体

基础语法

(param1, param2, …, paramN) => { statements }
(param1, param2, …, paramN) => expression
// 等价于：(param1, param2, …, paramN) => { return expression; }
/* 当删除大括号时，它将是一个隐式的返回值，这意味着我们不需要指定我们返回*/

// 如果只有一个参数，圆括号是可选的:
(singleParam) => { statements; }
singleParam => { statements; }

// 如果箭头函数 无参数 , 必须使用 ()圆括号或者 _下划线:
() => { statements; } 
或
_ => { statements; }

//返回一个对象时，函数体外要加圆括号
params => ({foo: bar})

// 支持 剩余参数 Rest parameters 和默认参数 default parameters:
(param1, param2, ...rest) => { statements }

// ...rest 参数, 必须是参数列表最后一个参数

不绑定 this

在箭头函数出现之前，每个新定义的函数都有其自己的this值（例如，构造函数的 this 指向了一个新的对象；严格模式下的函数的this值为undefined；如果函数是作为对象的方法被调用的，则其 this 指向了那个调用它的对象）。在面向对象风格的编程中，这会带来很多困扰。

function Person() {
    // 构造函数 Person() 定义的 `this` 就是新实例对象自己
    this.age = 0;
    setInterval(function growUp() {
        // 在非严格模式下，growUp() 函数定义了其内部的 `this`为全局对象, 
        // 不同于构造函数Person()的定义的 `this`
        this.age++;
    }, 3000);
}

var p = new Person();

在 ECMAScript 3/5 中，这个问题通过把this的值赋给变量，然后将该变量放到闭包中来解决。

function Person() {
    var self = this; 
    // 也有人选择使用 `that` 而非 `self`, 只要保证一致就好.
    self.age = 0;
    setInterval(function growUp() {
        // 回调里面的 `self` 变量就指向了期望的那个对象了
        self.age++;
    }, 3000);
}

var p = new Person();