近期群里常有人提一些簡單的問題，比如發一段代碼亂七八糟的代碼，然后說里面某個變量是什么，比如這里就有個很好的例子：

　　然后就可能有這樣的問題：

為什么this.arg是undefined？為什么2次調用fn的this是不一樣的？

　　為此，我覺得自己作為一個雖然不成熟的前端，對于一些自己力所能及的事情，還是應該傳道授業解惑的。所以，這篇文章，計劃從非常膚淺的層面上，來解釋一下javascript中的對象查找是如何進行的。

　　注意，本篇文章只是從表象上來介紹對象查找這一行為的過程，文章中的觀點并不全正確，甚至存在著一些謬誤，但是這也是為了讓初學者更好地理解對象查找這一過程。相信如果說得太過抽象、深入，反而會引起一些負面效果。如果有一天，你再回過來，發現這個文章說得并不那么正確，那么恭喜你，那個時候的你已經可以找到正確前進的道路，這篇中的錯誤也不會再對你有任何影響。

　　對象的分類

　　所謂對象查找，即在一段可執行代碼的作用域內，找到一個當前需要的對象。在javascript中，需要進行查找的對象大致可以分為3種類型：

• 變量查找，如foo++;，這里就會去查找一個叫作foo的變量。
• 屬性查找，如foo.bar++;，這里會去查找foo這個變量下的一個叫作bar的屬性。
• this查找，即針對this關鍵字的處理。

　　區分這3種類型的對象查找是首先要完成的任務，你可以基于以下原則進行判斷：

• 變量僅由變量名組成，即單獨的foo、bar等。
• 屬性永遠由2種形式去訪問，即foo.bar和foo['bar']，因此看到有“.”或“[]”即可當成是屬性查找。
• this就不用說了，好好的關鍵字。

　　看一下這段代碼：

　　這2行的代碼就體現了3種對象查找，分別為：

1. 查找this對象，并賦值給foo變量。
2. 查看foo變量。
3. 查找foo變量下的bar屬性，并將之作為一個函數進行調用。

　　變量的查找

　　當確定一個對象的查找為變量查找后，可以按照變量查找的規則來查看。

　　變量查找，即在作用域鏈上進行查找，作用域鏈是javascript非常著名的2條鏈之一，以下代碼體現一個標準的作用域鏈：

　　在c函數中，一共進行了2個變量的查找，分別為foo和bar。

　　變量的查找可以簡單地遵守“從下向上”的原則，即：

1. 在函數c的范圍內查找foo和bar，顯然在c里面并沒有foo和bar的聲明，查找失敗。
2. 在包含c的函數，即函數b的范圍內查找foo和bar，可以看到b里面只有對foo的賦值，并沒有聲明，查找失敗。
3. 在包括b的函數，即函數a的范圍內查找foo和bar，可以找到bar的聲明，因此確定bar為2。
4. 由于a不被任何函數包含，那么就在全局作用域內查找foo，發現有foo的聲明，因此確定foo的值為1。但是由于在函數b中，對這個foo有賦值，所以foo的值被修改為3。
5. 完確定foo的值為3，bar的值為2，因此輸出"3,2"。

　　總結一下，變量的查找是延著作用域鏈進行的，作用域鏈可以簡單地看成函數間的包含關系，被包含的函數中不存在某個變量時，在包含他的函數中查找，直到全局作用域。

　　屬性的查找

　　當確定一個對象的查找為屬性查找后，可以按照屬性查找的規則來查看。

　　屬性查找，即在原型鏈上進行查找，原型鏈是javascript雙鏈的另一條，以下可以表示出一個原型鏈：

　　屬性查找是一個不斷尋找prototype的過程，即：

1. 查找c.prototype中，有沒有顯示定義foo和和bar，發現定義了foo，其值為3。
2. 發現c.prototype就是new b()得到的對象，那么查找b.prototype中，有沒有顯示定義bar，發現定義了，其值為2。
3. 因此確定foo的值為3，bar的值為2，輸出"3,2"。

　　總結一下，屬性查找是延著原型鏈進行的，原型鏈的具體知識這里不作詳細解釋，可以另找文章進行參考。所有的對象，其原型鏈最終會是Object.prototype。

　　this的查找

　　this的查找是很多人迷茫的一點，也似乎有很多人抱有this不穩定這樣的看法，實在令人無語。this的查找可以說是3種對象查找中最為簡單的，因為其實this對象的確定根本沒有一個“查找”的過程。

　　首先，this對象只會在一個函數中需要確定，如果是在全局域下，this永遠為Global對象，在瀏覽器中通常就是window對象。而在javascript中，函數的調用一共有4種方式：

　　Function Invocation Pattern

諸如`foo()`的調用形式被稱為Function Invocation Pattern，是函數最直接的使用形式，注意這里的foo是作為單獨的變量出現，而不是屬性。

在這種模式下，foo函數體中的this永遠為Global對象，在瀏覽器中就是window對象。

　　Method Invocation Pattern

諸如`foo.bar()`的調用形式被稱為Method Invocation Pattern，注意其特點是被調用的函數作為一個對象的屬性出現，必然會有“.”或者“[]”這樣的關鍵符號。

在這種模式下，bar函數體中的this永遠為“.”或“[”前的那個對象，如上例中就一定是foo對象。

　　Constructor Pattern

`new foo()`這種形式的調用被稱為Constructor Pattern，其關鍵字`new`就很能說明問題，非常容易識別。

在這種模式下，foo函數內部的this永遠是new foo()返回的對象。

　　Apply Pattern

`foo.call(thisObject)`和`foo.apply(thisObject)`的形式被稱為Apply Pattern，使用了內置的`call`和`apply`函數。

在這種模式下，`call`和`apply`的第一個參數就是foo函數體內的this，如果thisObject是`null`或`undefined`，那么會變成Global對象。

　　應用以上4種方式，確定一個函數是使用什么樣的Pattern進行調用的，就能很容易確定this是什么。

　　另外，this是永遠不會延作用域鏈或原型鏈出現一個“查找”的過程的，只會在函數調用時就完全確認。

　　總結

　　對于一個對象的查找：

1. 確定是變量查找、屬性查找還是this查找。
2. 如果是變量查找，則延作用域鏈找，找不到就是ReferenceError。
3. 如果是屬性查找，就延原型鏈找，找歪以就是undefined。
4. 如果是this查找，去找調用函數的代碼，根據調用的形式來確定this是什么。

5. 注意把一次查找過程拆分開來，比如this.foo.bar.yahoo()，可以拆分成這樣的代碼，就能更清楚了：

   var o = this; // this查找
   var foo = o.this; // 屬性查找
   var bar = foo.bar; // 屬性查找
   bar.yahoo(); // 屬性查找，加Method Invocation Pattern

　　最后，如果有一天你可以了解這些東西，這篇文章對你用戶也就不大了：

• 為什么延作用域查找不到會有ReferenceError。
• 其實變量也是屬性，一個特殊對象的屬性。
• this也許不是Global，也許會是undefined。