ES6 箭头函数

箭头函数

ES6 允许使用“箭头”（=>）定义函数。

=> 7 等价于 {return 7}

var f = v => 7;
// 等同于
var f = function (v) {
  return 7;
};
//console.log(f(2))   2

函数参数有多个的情况

如果箭头函数不需要参数或需要多个参数，就使用一个圆括号代表参数部分。

var f = () =>5;
等价于
function f(){
return 5;
}
    console.log(f(77));//5

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

//console.log(sum(1,10))  11

返回多条语句

如果箭头函数的代码块部分多于一条语句，就要使用大括号将它们括起来，并且使用return语句返回。

一条语句：表达式javascript短语,语句是javascript整句或命令,javascript语句是分号结尾

 var fn=(num1,num2)=>num1=num1+num2;console.log(num1) //报错Uncaught ReferenceError: num1 is not defined

返回为对象

由于大括号被解释为代码块，所以如果箭头函数直接返回一个对象，必须在对象外面加上圆括号，否则会报错。

// let getTempItem = id => { id: id, name: "Temp" };//报错：Uncaught SyntaxError: Unexpected token ':' (at demo_obj.js:1:39)
//由于大括号被解释为代码块，所以如果箭头函数直接返回一个对象，必须在对象外面加上圆括号，否则会报错。

let getTempItem = id =>({ id: id, name: "Temp" });
//getTempItem(1)  输出 {id: 1, name: 'Temp'}
 

箭头函数有点；简化函数

[1,2,3].map(function (x) {
  return x * x;
});   //输出 [1, 4, 9]

//改写成箭头函数
[1,2,3].map(x=>x*x)  //输出[1, 4, 9]

function foo() {
    setTimeout(() => {
      console.log('id:', this.id);
    }, 100);
  }
  var id = 21;
  foo.call({ id: 42 }); //id: 42

this指向的固定化，并不是因为箭头函数内部有绑定this的机制，实际原因是箭头函数根本没有自己的this，导致内部的this就是外层代码块的this。正是因为它没有this，所以也就不能用作构造函数。