如何返回帶有胖箭頭功能的對象而不重新綁定？

Question

我有一個簡單的函數（一個陣營組件內）：

getInitialState: function() { 
    return { 
    text: this.props.text 
    } 
} 

但我想胖arrowify它：

getInitialState:() => { 
    text: this.props.text 
} 

除了我得到一個錯誤，因爲畢竟胖箭頭手段{一段代碼返回undefined（除非你明確return東西）。至少這是我一開始就想到的。但我認爲this現在正在綁定該胖箭頭功能，現在this.props是undefined。

所以我試試這個：

getInitialState:() => new Object({ 
    text: this.props.text 
}) 

，但我得到了同樣的錯誤，this.props是不確定的。

所以我想我有2個問題，我很好奇。首先，從一個簡單的語句胖箭頭函數返回對象的慣用方法是什麼？其次，我該如何返回一個對象，該對象引用了周圍環境的對象this？

Answer 1

用括號括起來，像這樣

getInitialState:() => ({ 
    text: this.props.text 
}) 

沒有括號，對象文字看上去也像一個標籤，一個JavaScript塊稱爲它text。由於它不明確，所以引發了SyntaxError。但是當你用()包圍它時，JavaScript知道它是一個對象字面值。

---

我覺得這是現在正在綁定到箭頭功能

箭函數沒有this。當在箭頭函數中遇到this時，它將轉到上一級以查看this是否在那裏可用並使用它。可以確認，這樣

(function Test1() { 
    console.log(this); 
    (() => console.log(this))(); 
}).bind({a: 1})(); 

將打印

{ a: 1 } 
{ a: 1 } 

在你的情況，this將把在聲明它的功能，而不是對象本身的this對象。