普通函式中的this:
1. this總是代表它的直接呼叫者, 例如 obj.func ,那麼func中的this就是obj
2.在預設情況(非嚴格模式下,未使用 'use strict'),沒找到直接呼叫者,則this指的是 window
3.在嚴格模式下,沒有直接呼叫者的函式中的this是 undefined
箭頭函式中的this
預設指向在定義它時,它所處的物件,而不是執行時的物件, 定義它的時候,可能環境是window(即繼承父級的this);
下面通過一些例子來研究一下 this的一些使用場景
示例11
2
3
4
5
6
7
8
9
10
結果是:window
匿名函式,定時器中的函式,由於沒有預設的宿主物件,所以預設this指向window
問題: 如果想要在settimeout中使用這個物件的引用呢?
用乙個 變數提前把正確的 this引用儲存 起來, 我們通常使用that = this, 或者 _this = this來儲存我們需要的this指標!
1
2
3
4
5
6
7
8
9
10
11
12
13
示例21
2
3
4
5
6
7
8
9
10
11
12
13
14
window.val = 1;
var
obj =
};
// 說出下面的輸出結果
obj.dbl();
var
func = obj.dbl;
func();
結果是:2 4 8 8
<1> 12行**呼叫
val變數在沒有指定物件字首,預設從函式中找,找不到則從window中找全域性變數
即 val *=2 就是 window.val *= 2
this.val預設指的是 obj.val ;因為 dbl()第一次被obj直接呼叫
<2>14行**呼叫
func() 沒有任何字首,類似於全域性函式,即 window.func呼叫,所以
第二次呼叫的時候, this指的是window, val指的是window.val
第二次的結果受第一次的影響
示例3.在嚴格模式下的this
1
2
3
4
5
6
7
結果是:undefined
示例4.箭頭函式中的this
1
2
3
4
5
6
7
8
9
10
此時的this是定義它的物件,即繼承父級的this,父級中的this指的是obj,而非window
示例51
2
3
4
5
6
7
8
9
10
11
12
13
14
結果:都是obj
f1繼承父級this指代的obj,不管f1有多層箭頭函式巢狀,都是obj.
示例61
2
3
4
5
6
7
8
9
10
11
12
13
14
結果:window,window
第乙個this:f1呼叫時沒有宿主物件,預設是window
第二個this:繼承父級的this,父級的this指代的是window.
關於ES6中箭頭函式this和普通函式this指向
this代表他的直接呼叫者,例如obj.func,那麼func的this就是obj 在預設情況下 非嚴格模式 沒直接找到呼叫者,則this指的是window 在嚴格模式下,沒有直接呼叫者的函式中的this是 undefined 結果為window 匿名函式,say函式沒有預設的宿主物件,所以預設th...
ES6的箭頭函式this和普通函式的this區別
普通函式中,內層函式不能從外層函式中繼承this的值,在內層函式中,this會是window或者undefined,臨時變數self用來將外部的this值匯入到內部函式中 另外的方式是在內部函式執行.bind this es6中的箭頭函式會直接呼叫的this是繼承父級的this。functionfu...
ES6中箭頭函式的作用
那為什麼在es6中引入了箭頭函式呢?最主要的目的就是解決this指標的問題。我們知道在es6中,我們可以建立乙個class,如果我們預設在其裡面加入乙個函式的話,其必須在呼叫的時候,必須繫結this指標,否則不能訪問當前類的例項裡面的屬性。下面舉乙個具體的例子,為什麼其能解決this指標的問題。比如...