this指向問題

1、普通函式呼叫

這個情況沒特殊意外，就是指向全域性物件-window。

let username=
'cn'
functionfn(
)fn()
;

可能大家會困惑，為什麼不是輸出守候，但是在細看一看，我宣告的方式是let，不會是window物件

如果輸出守候，要這樣寫

var username=
'cn'
functionfn(
)fu()
;

window.username=
'cn'
functionfn(
)fn()
;

//可以理解為

2、物件函式呼叫

這個相信不難理解，就是那個函式呼叫，this指向**

window.b=
2222
let obj=
}obj.fn(
);

很明顯，第一次就是輸出obj.a，就是111。而第二次，obj沒有b這個屬性，所以輸出undefined，因為this指向obj。

但是下面這個情況得注意

let obj1=
;let obj2=
}obj1.fn=obj2.fn;
obj1.fn(
);//222

這個相信也不難理解，雖然obj1.fn是從obj2.fn賦值而來，但是呼叫函式的是obj1，所以this指向obj1。

3、構造函式呼叫

let
testclass
=function()
let subclass=
newtestclass()
;subclass.name=
'cn'
;console.
log(subclass.name)
;//cn
let subclass1=
newtestclass()
;console.
log(subclass1.name)
//111

這個也是不難理解，回憶下（new的四個步驟）就差不多了！

但是有乙個坑，雖然一般不會出現，但是有必要提一下。

在建構函式裡面返回乙個物件，會直接返回這個物件，而不是執行建構函式後建立的物件

let obj1=
;let obj2=
}obj2.fn.
call
(obj1)
;複製**

5、箭頭函式呼叫

首先不得不說，es6 提供了箭頭函式，增加了我們的開發效率，但是在箭頭函式裡面，沒有 this ，箭頭函式裡面的 this 是繼承外面的環境。

乙個例子

let obj=)}
};obj.fn(
);//undefined

不難發現，雖然 fn() 裡面的 this 是指向 obj ，但是，傳給 settimeout 的是普通函式， this 指向是 window ， window 下面沒有 a ，所以這裡輸出 undefined。

換成箭頭函式

let obj=);
}};obj.fn(
);//222

這次輸出 222 是因為，傳給 settimeout 的是箭頭函式，然後箭頭函式裡面沒有 this ，所以要向上層作用域查詢，在這個例子上， settimeout 的上層作用域是 fn。而 fn 裡面的 this 指向 obj ，所以 settimeout 裡面的箭頭函式的 this ，指向 obj 。所以輸出 222 。

letfn=
function
(a,b,c)
let arr=[1
,2,3
];如上面這個例子
let obj1=
;let obj2=
}obj2.fn.
call
(obj1)
;

1.改變 this 的指向（把 this 從 obj2 指向到 obj1 ）

2.方法借用（ obj1 沒有 fn ，只是借用 obj2 方法）

this指向問題

this指向問題

this指向問題

this指向問題

相關推薦