物件導向的JavaScript編程及其 Scope 處理

本文首先對 JavaScript 的機制進行講解，並結合當前流行的開源 JavaScript 架構講解如何在 JavaScript 中實現物件導向和繼承機制；之後本文將對物件導向 JavaScript 編程中容易引起誤解和 Scope 的幾個問題做詳細闡述；最後針對物件導向的 JavaScript 編程中的 Scope 問題給出幾點建議。

物件導向和類比繼承
JavaScript 是一種弱類型解釋啟動並執行指令碼語言，就語言本身來講它不是一門物件導向語言。但是我們可以利用一些語言的特性來類比物件導向編程和繼承機制，這所有的一切都需要從 JavaScript 中的 function 說起。
Function 是一個定義一次但可以調用或執行無數次的 JavaScript 程式碼片段。Function 可以有零個或者多個輸入參數和一個傳回值，它通常被用來完成一些計算或者交易處理等任務。通常我們這樣定義一個 function：
Function 定義樣本           
  function distance(x1, y1, x2, y2) {
    var dx = x2 - x1;
    var dy = y2 - y1;
    return Math.sqrt(dx*dx + dy*dy);
 }

在 JavaScript 中，function 不僅是是一種文法結構，它還可以被作為資料。這意味著它可以被賦值給變數，在對象或數組中的元素的屬性儲存區，或者作為函數參數傳遞等等。例如：
Function 作為資料樣本           
 var d = distance;
 d(1,1,2,2);
當在一個object 中定義和調用一個 function 時，這個 function 被稱作該 object 的一個方法。需要注意的是當這個 function 被調用時，這個 object 會以隱含參數的形式傳入到 function 裡，function 內部可以通過 this 關鍵字來引用這個 object 的屬性。例如下面這個例子運行結果 calculator.result的值為 2。
This 關鍵字樣本           
var calculator = {
        operand1: 1,
        operand2: 1,
    compute: function () {
        this .result = this .operand1 + this .operand2;
        }
     };
 calculator.compute();
 alert(calculator.result);
在 JavaScript 中，對象的建立通常是通過 new 運算子來完成的。new 關鍵字後面必須是一個可執行檔 function。例如：
New 關鍵字樣本           
 var array = new Array(10);
 var today = new Date( );
當上面這條建立語句被執行時，首先會建立一個空的對象賦給前面的變數，然後再調用後面緊跟的 function，並將這個空的對象作為隱含參數傳入到 function 內部。這樣在 function 內部就可以通過 this 關鍵字引用該對象，做一些對象初始化工作。這樣的一個 function 通常被稱為構造方法或者簡單構造方法。例如：
 構造方法樣本           
 function Rectangle(w, h) {
    this .width = w;
    this .height = h;
 }
 var rect1 = new Rectangle(2, 4);
講到這裡我們已經有了對象、函數、作為資料的函數、對象方法和建構函式，於是我們可以使用這些 JavaScript 的特性類比寫出類似於 java 風格物件導向的代碼。例如：