オブジェクトの分割代入
Reactではpropsの管理に分割代入がよく使われる。
分割代入しない場合
code: .js
const myProfile = {
name: "田中",
age: 24
};
// 取得
myProfile.name //=> "田中"
myProfile.age //=> 24
分割代入するとこう書ける
code: .js
const myProfile = {
name: "田中",
age: 24
};
// オブジェクトの分割代入(ここが肝!!)
const {name, age} = myProfile
// 🤔 name = myProfile.name / age = myProfike.age をしてるイメージ
// myProfileを省略して取得できる✨
name //=> "田中"
age //=> 24
ルール
名称さえ合ってれば順不同でもOK
code: .js
const {age, name} = myProfile
一部だけ取り出すこともできる
code: .js
const { age } = myProfile
元々のプロパティ名(name, age)とは違う名前を設定できる
code: .js
const myProfile = {
name: "田中",
age: 24
};
const {name: hogehoge, age: fugafuga} = myProfile
// 取得
hogehoge //=> "田中"
fugafuga //=> 24
// ※ name と age では取得できない
name //=> ''
age //=> Uncaught ReferenceError: age is not defined