關於javascript中的this

笑口常開發表於2016-12-30

剛剛讀完《你不知道的javascript》(上卷),自我感覺良好,昨天在node社群上看到一個關於js的this的問題,就想著測試以下自己,悲劇的是沒做出來。 今天看了下之前的總結,分析了下問題,在這裡寫下分析過程,也算是一種鞏固知識的措施。 問題:

var length = 10;
function fn() {
    console.log(this.length)
};
var obj = {
length: 5, 
method: function (a) {
        a();
        console.log(arguments[0]);
        arguments[0]();
        a.call(obj, 12);
    }
};
obj.method(fn, 1, 2);

分析思路: 首先,通過obj.method進行方法呼叫,此時應用的是this的隱式繫結規則,method方法中的this會指向obj,接下來執行隱式賦值,將全域性函式fn傳入了method中,此時會產生this丟失,進而應用this的預設繫結規則,將this指向全域性,所以第一個a()函式執行的結果是10

然後是arguments0的方式繼續呼叫fn,由於arguments[0]是引用的arguments物件中的fn,所以此時的this指向的是arguments物件,所以返回的this是3

最後是呼叫的call方法,所以應用的是this的顯式繫結,將fn中的this繫結到了obj這個物件,所以是5

相關文章