好程式設計師web前端學習路線之在JavaScript中使用getters和setter

　　 好程式設計師 web前端學習路線之 在 JavaScript中使用getters和setter， 大多數物件導向的程式語言都存在 getter和setter，包括JavaScript。它們是程式碼構造，可幫助開發人員以安全的方式訪問物件的屬性。使用getter，您可以從外部程式碼訪問 （ “獲取”） 屬性的值，而 setter允許您更改 （ “設定”） 它們的值。我們將向您展示如何在 JavaScript中建立getter和setter。

　　JavaScript物件可以具有多個屬性和儲存的靜態資料和動態功能的方法。屬性是靜態鍵值對，而方法是特定於物件的函式。

　　 例如， Car.color可以是屬性，而Car.drive（）可以是 Car 物件的方法。使用 getter，您可以訪問Car物件的color屬性，使用setter，您可以修改其值（例如，從藍色變為黑色）。

　　 使用 getter和setter，您只能獲取和設定屬性的值，而不能獲取方法，因為方法不是靜態的。

　　 您可以透過三種不同的方式建立 getter和setter：

1. 使用預設方法語法（ getter和setter方法），
2. 使用 get和set關鍵字，
3. 使用 Object.defineProperty（） 方法。

　　

Getters和Setters

Getters和Setters使你可以快速獲取或設定一個物件的資料。一般來說，一個物件擁有兩個方法，分別用於獲取和設定某個值，比如：

{

　　getValue: function(){

　　return this._value;

　　},

　　setValue: function(val){

　　this._value = val;

　　}

}

用這種方式寫 JavaScript的一個明顯的好處是：你可以用它來隱藏那些不想讓外界直接訪問的屬性。

吸氣方法

獲取物件屬性的最簡單方法是使用每個屬性的預設方法語法定義 getter。讓我們看一個如何使用這種技術建立getter的示例。該MYCAR物件有兩個屬性：顏色和製作。這是您使用物件文字建立它的方法：

var myCar = {   

    color：“blue”，

    make：“Toyota”

};

如果需要，可以使用以下程式碼直接訪問顏色並建立屬性：

myCar.color;

// 藍色

myCar.make;

//豐田

儘管這種技術有效，但使用 getter而不是直接呼叫屬性具有許多優點。例如，您可以在檢索其值之前對屬性執行操作或檢查（例如  if-else語句）。 

關於get關鍵字最重要的一點是它定義了一個訪問器屬性，而不是一個方法。因此，它不能與儲存其訪問的值的資料屬性具有相同的名稱。在上面的程式碼中，defColor 和defMake是資料屬性，而color和make是訪問器屬性。

這也是為什麼你需要使用在getter名稱之後不使用括號的屬性語法來呼叫getter的原因（例如myCar.color）。

由於舊版IE8不支援get關鍵字，因此如果您需要支援舊版瀏覽器，請使用getter方法。

結論

在建立JavaScript物件時，您不一定必須使用getter和setter，但在許多情況下它們可能會有所幫助。最常見的用例是（1）保護對資料屬性的訪問，以及（2）在獲取或設定其值之前向屬性新增額外的邏輯。