箭頭函數(shù)在平時(shí)開發(fā)中用著非常爽嫩码,箭頭函數(shù)有什么特點(diǎn)呢
- 箭頭函數(shù)不能夠當(dāng)做構(gòu)造函數(shù)使用
- 箭頭函數(shù)沒有arguments對(duì)象
- 箭頭函數(shù)不能夠用yield脆淹,不能用作generator函數(shù)
- 箭頭函數(shù)沒有prototype屬性祈餐,prototype屬性值為空
箭頭函數(shù)的this總是指向最近一層的作用域
舉個(gè)例子褥符,總所周知普調(diào)函數(shù)的this指向都是誰(shuí)調(diào)用他指向誰(shuí)
var name ="張三"
var obj = {
name: '李四',
getName: function() {
console.log(this.name)
return function(){
console.log(this.name)
}
}
}
obj.getName()()
// 輸出結(jié)果
// 李四
// 張三
因?yàn)?code>obj.getName()相當(dāng)于是obj調(diào)用的家破,所以里面的this
指向obj仓坞,obj.getName()()
相當(dāng)于是window調(diào)用的
obj.getName()()
// 等價(jià)于
var fn = obj.getName()
window.fn()
另外一個(gè)例子
var name ="張三"
var obj = {
name: '李四',
getName: function() {
console.log(this.name)
return s = () =>{
console.log(this.name)
}
}
}
obj.getName()()
// 輸出結(jié)果
// 李四
// 李四
在getName中返回一個(gè)箭頭函數(shù)背零,因?yàn)榧^函數(shù)是在getName中,getName是它的一個(gè)上最近的一個(gè)函數(shù)作用域,所以箭頭函數(shù)中的this指向obj扯躺。另外一個(gè)例子
var name ="張三"
var obj = {
name: '李四',
getName: () => {
console.log(this.name)
return s = () =>{
console.log(this.name)
}
}
}
obj.getName()()
會(huì)輸出什么結(jié)果捉兴,大部分人可能跟我一樣會(huì)認(rèn)為會(huì)輸出
李四 李四 // 其實(shí)最終的結(jié)果是張三 張三
剛開始都以為getName這個(gè)箭頭函數(shù)是指向的object,其實(shí)不然录语,它是指向window的倍啥。箭頭函數(shù)的this是 根據(jù)該函數(shù)的作用域指向的對(duì)象,作用域是指函數(shù)內(nèi)部,getName作用域其實(shí)是指最外層的js環(huán)境澎埠,因?yàn)間etName沒有被函數(shù)包裹,最外層又是指向window
- 箭頭函數(shù)使用
call applay
等改變this的指向也是沒有用的虽缕,比如
var name ="張三"
var obj = {
name: '李四',
getName: () => {
console.log(this.name)
}
}
var obj1 = {
name: '李四',
getName: function() {
console.log(this.name)
}
}
obj.getName.call({name: '王五'}) // 張三
obj1.getName.call({name: '王五'}) // 王五