js之get、set詳解

瞭解之前先看代碼，看完之後保證神清氣爽，瞬間融匯貫通，上代碼！

const obj = {
  log: ['a', 'b', 'c'],
  get latest() {
    if (this.log.length === 0) {
      return undefined;
    }
    return this.log[this.log.length - 1];
  },
  quit: function(){
   if (this.log.length === 0) {
      return undefined;
    }
    return this.log[this.log.length - ２];
  }
};

console.log(obj.latest);//this is get function
console.log(obj.quit);//輸出的是quit函數的定義
console.log(obj.quit());//this is quit function

get的官方解釋：get語法將對象屬性綁定到查詢該屬性時將被調用的函數。

說人話的翻譯：ge在對象裏定義了一個查找對象屬性的方法，這個方法是一個‘自執行方法’或者說是‘被調用的方法’，使用的時候無需再調用。

與對象方法的區別：對象方法需要調用，而get方法不需要，因爲get綁定的是‘方法的調用’

同理set方法

官方解釋：當嘗試設置屬性時，set語法將對象屬性綁定到要調用的函數。

解釋：set在對象裏定義了一個設置對象屬性的方法，這個方法是一個‘自執行方法’或者說是‘被調用的方法’，使用的時候無需再調用，而自動執行，以方便直接賦值。

const language = {
  set current(name) {
    this.log.push(name);
  },

  log: [],

  add: function(age){
    this.pushLog.push(age);
  },

  pushLog: []

};

language.current = 'EN';
language.current = 'FA';

console.log(language.log);//["EN", "FA"]

language.add(18);
language.add(20);
console.log(language.pushLog)//[18, 20]

但是對比get方法，set方法的簡潔程度一般，而且傳參的方式形同賦值，令人難以理解，所以感覺比較雞肋

注意：get和set的方法會以get 方法名或者set 方法名的形式保存在對象的屬性裏