網站搜尋

javascript - ES6 getter/方法不使用大括號


我有一些包含許多簡短 getter/方法的類別。

範例:

get jQuery() {
  return this.pageConfig.jQuery || jQuery;
}

具有相似內容的箭頭函數可以寫成如下形式:

() => this.pageConfig.jQuery || jQuery;

這是一行程式碼,因此只佔用1/3的垂直空間。

但它既不是取值器,也不是方法。

有推薦的方式以單行形式編寫 getter/方法嗎?(如果可能,不使用大括號,且不用 return 關鍵字)

我的 getter 方法和其他方法不需要修改物件。它們只是用來讀取。

答案#1

對於一句話版本,只要用這個就行:

get jQuery() {return this.pageConfig.jQuery || jQuery;}

箭頭函數不適合用於方法定義,因為它們使用的是詞法作用域的 this,而方法需要的是對象的 this。請記住,雖然箭頭函數是一個很好的簡寫,但它們也會以通常與方法定義不兼容的方式影響 this 的值。

答案#2

不,沒有比(你可以跳過 ;)更短的了

get jQuery() { return this.pageConfig.jQuery || jQuery }

多一點解釋

你不能使用箭頭函數(() => this.pageConfig.jQuery || jQuery),因為首先它不是一個 getter 函數,並且 this 不指向物件的上下文,而是指向執行的上下文(這可能是物件,但不一定)。

曾經/現在有 __defineGetter__ 函數(一些文件),它允許你定義一個 getter。它現在已被棄用,並且可能甚至比 get 更複雜。但正如文件所說,它被廣泛使用,可能永遠不會被移除。

幸好對你來說:我完全支持瘋狂的解決方案

class Test {
  
  constructor() {
    this.pageConfig = {}
    this.pageConfig.jQuery = "value"
    
    let properties = {
      'jQuery': () => this.pageConfig.jQuery || "Default",
      'text': () => this.pageConfig.text || "Default"
    }
    for(let prop in properties) this.__defineGetter__(prop, properties[prop])
    
  }
  
}

let t = new Test
console.log(t.jQuery)
console.log(t.text)

快樂的一行程式碼(但老實說還是直接使用 ECMA 5 的 get)」