從一道面試題看ES6箭頭函式
阿新 • • 發佈:2019-01-01
前幾天頭條面試碰到了這樣一道面試題,讓我寫出每行程式碼的執行結果:
var f = x => x; f(1); //return 1
var f = x => {x}; f(1); //function(x)={x};
var f = x => ({x}) ;f(1);//return {1}(返回一個物件)
ES6 允許使用“箭頭”(=>)定義函式。
var f = v => v;
上面的箭頭函式等同於:
var f = function(v) {
return v;
};
如果箭頭函式不需要引數或需要多個引數,就使用一個圓括號代表引數部分。
var f = () => 5;
// 等同於
var f = function () { return 5 };
var sum = (num1, num2) => num1 + num2;
// 等同於
var sum = function(num1, num2) {
return num1 + num2;
};
如果箭頭函式的程式碼塊部分多於一條語句,就要使用大括號將它們括起來,並且使用return語句返回。
var sum = (num1, num2) => { return num1 + num2; }
由於大括號被解釋為程式碼塊,所以如果箭頭函式直接返回一個物件,必須在物件外面加上括號。
var getTempItem = id => ({ id: id, name: "Temp" });
箭頭函式有幾個使用注意點。
(1)函式體內的this物件,就是定義時所在的物件,而不是使用時所在的物件。
(2)不可以當作建構函式,也就是說,不可以使用new命令,否則會丟擲一個錯誤。
(3)不可以使用arguments物件,該物件在函式體內不存在。如果要用,可以用 rest 引數代替。
(4)不可以使用yield命令,因此箭頭函式不能用作 Generator 函式。