2016-08-03 73 views
1

我想知道的區別:使用哈希來聲明一個變量在ReactJS/JavaScript的ES6

const data = this.props.content; 

而且

const {data} = this.props.content; 

我面前,但所有聲明3個或4個變量看到它一起。然而,我從來沒有看到它只有1個變量。

有什麼區別?

+0

在第一種情況下,您將數據分配給'.content',第二種情況下,您從'.content'中獲得'data'屬性並將其分配給變量'data' - 它等同於'const data = this。 props.content.data;' –

+0

哦,我想我明白了。例如,如果我這樣做:'const {content} = this.props'等同於'const content = this.props.content',對吧? – Ruffeng

+0

是的,你是對的 –

回答

1

這是爲您的變量使用相同名稱的語法優勢。它利用ES6解構。我相信你列出的例子應該略作修改,說明並希望能回答你的問題。

const data = this.props.content; // is exactly the same as 
const {content} = this.props; 

解構的一篇精闢論述可以在這裏找到:Some ES6+ features used in React development

+0

不,它不是**完全一樣。第一行定義了一個名爲'data'的變量,第二行定義了一個名爲'content'的變量。 – 2016-08-03 13:59:52

0

在你的第一個例子中,要設置datathis.props.content

你的第二個例子被稱爲解構,可以讀取更多here

你基本上是拉出來你把右手邊的創建一個新的變量。