JavaScript訪問器怎么用

本文小編為大家詳細(xì)介紹“JavaScript訪問器怎么用”，內(nèi)容詳細(xì)，步驟清晰，細(xì)節(jié)處理妥當(dāng)，希望這篇“JavaScript訪問器怎么用”文章能幫助大家解決疑惑，下面跟著小編的思路慢慢深入，一起來學(xué)習(xí)新知識吧。

JavaScript 訪問器（Getter 和 Setter）

為什么使用 Getter 和 Setter？

它提供了更簡潔的語法

它允許屬性和方法的語法相同

它可以確保更好的數(shù)據(jù)質(zhì)量

有利于后臺工作

JavaScript Getter（get 關(guān)鍵詞）

本例使用 lang 屬性來獲取 language 屬性的值。

實(shí)例

// 創(chuàng)建對象：

var person = {

  firstName: "Bill",

  lastName : "Gates",

  language : "en",

  get lang（） {

    return this.language;

  }

};

// 使用 getter 來顯示來自對象的數(shù)據(jù)：

document.getElementById（"demo"）。innerHTML = person.lang;

JavaScript Setter（set 關(guān)鍵詞）

本例使用 lang 屬性來設(shè)置 language 屬性的值。

實(shí)例

var person = {

  firstName: "Bill",

  lastName : "Gates",

  language : "",

  set lang（lang） {

    this.language = lang;

  }

};

// 使用 setter 來設(shè)置對象屬性：

person.lang = "en";

// 顯示來自對象的數(shù)據(jù)：

document.getElementById（"demo"）。innerHTML = person.language;

JavaScript 函數(shù)還是 Getter？

下面兩個例子的區(qū)別在哪里？

例子 1

var person = {

  firstName: "Bill",

  lastName : "Gates",

  fullName : function（） {

    return this.firstName + " " + this.lastName;

  }

};

// 使用方法來顯示來自對象的數(shù)據(jù)：

document.getElementById（"demo"）。innerHTML = person.fullName（）;

例子 2

var person = {

  firstName: "Bill",

  lastName : "Gates",

  get fullName（） {

    return this.firstName + " " + this.lastName;

  }

};

// 使用 getter 來顯示來自對象的數(shù)據(jù)：

document.getElementById（"demo"）。innerHTML = person.fullName;

讀到這里，這篇“JavaScript訪問器怎么用”文章已經(jīng)介紹完畢，想要掌握這篇文章的知識點(diǎn)還需要大家自己動手實(shí)踐使用過才能領(lǐng)會，如果想了解更多相關(guān)內(nèi)容的文章，歡迎關(guān)注億速云行業(yè)資訊頻道。