1. 程式人生 > >JavaScript中this物件原理簡潔說明

JavaScript中this物件原理簡潔說明

今天看了阮一峰大神的部落格文章:JavaScript 的this原理,把糾結很久的this的指向終於理解清楚了

原文:http://www.ruanyifeng.com/blog/2018/06/javascript-this.html

現在來說說如何區分不同情況下的this物件指向,如下所示:

var obj = {
  num: 12,    
  foo: function() { console.log(this.num) }          
}

var num = 2;
var fun = obj.foo;

obj.foo(); // 12
fun(); // 2

obj.foo() 即為呼叫obj物件下的foo屬性對應的方法,但是執行環境還是在物件obj中,故此時的this指向obj物件,故輸出為12;

對於 var fun = obj.foo(),相當於是將obj物件下的foo函式在記憶體中的地址賦值給了變數fun,而變數fun卻是一個全域性變數,所以fun() 的執行環境其實是在window物件下,fun()執行起來後其下的函式foo裡的this指向window物件,故此時輸出為2;

 

這是我看了大神部落格後的理解加總結,如果有什麼不對的地方,希望指正。