箭頭函數
- 箭頭函數表達式是ES6標準新增的定義函數的一種方式
最簡單的箭頭函數
var f = x=>x*x;
f(2);//4
相當于
var f = (x)=>{
return x*x;
}
f(2);//4
箭頭函數的省略原則
- 箭頭函數的標志就是箭頭 => 箭頭的左邊是參數 右邊是函數體
- 當只有一個參數時,參數可以省去()
- 沒有參數和有多個參數都不能省去()
- 當函數體只有一行語句時,{}和return關鍵詞都可以省略,相當于 { return xxx; }
- 函數體沒有一行語句時,或者有多行語句時,{}和return都不可以省略,
{return {};}
省略return{{}}
代表著{{};return undefined}}
。- 原因在于 直接返回的對象{},會跟函數體的
{...}
表達有沖突,因此直接返回{}格式的對象時,{}和return都不能省
- 原因在于 直接返回的對象{},會跟函數體的
省略了箭頭左邊的() 和 箭頭右邊的 {} 及 return
(x=>console.log(x))(6);//6
//類比function定義 相當于
(function (x) {
return console.log(x);//直接返回函數調用,復習一下,這個叫做尾調用。
})(6);
省略了 箭頭右邊的 {} 及 return
((x,y)=>console.log(x+y))(3,4);
返回{}是不能省略箭頭右邊的{}和return
var f = ()=>{};
console.log(f());//undefined 而不是 {}
var f = ()=>{name:'xiaoming'};
console.log(f());//undefined 而不是 {name:'xiaoming'}
箭頭右邊的省略的本質,是將箭頭 右邊的 語句 作為一個整體 包裹在函數體中 {};
解釋如下:
var f = x=>x*x;
//相當于
var f = x => {
return x*x;
}
因此返回對象的正確方法是
- 不直接使用{}
var obj = {};
var f = ()=>obj;
console.log(f(obj));//{}
- 不省略{}和return
var f = ()=>{
return {};
};
console.log(f());
箭頭函數和匿名函數的區別
var a = x=>x*x;
var b = function (x) {
return x*x;
}
嚴格來說,a和b定義的函數并不相等,
- 箭頭函數不綁定 this
- 箭頭函數內部的this是詞法作用域,由上下文確定,也就是誰調用它,它指向誰。
- function函數定義 內部的this指向由調用方式決定。因為function函數綁定了this,而call、play、bind都會改變this指向
- 1.直接調用:非嚴格模式 默認指向全局對象瀏覽器環境是window node環境是global; 嚴格模式下 默認未定義undefined
- 2.既然箭頭函數沒有綁定this,那么call,play,bind是為了改變this指向,因此 不適用于 箭頭函數。使用這些方法,也不會改變this的指向。
- 箭頭函數也沒有綁定 arguments,super或 new.target 參數,不能用作構造函數。