propsで受け取る場合と、useState()で受け取る場合が違う・・・
propsは親から子へパラメータを受け渡すときに使うヤツ。
useState()は変数を動的に変化させるときに使うヤツ。
チュートリアルで「どっちも分割代入で受け取るよ!」とは言うものの、
なんか受け取るときのカッコが違くね?と疑問に思った初心者向けです。
どっちも分割代入で配列を受けとる
props
const {name, age} = props;
useState()
const [num, setNum] = useState([]);
propsは{}中括弧で受け取るのに対し、useState()は[]大括弧で受け取る。
この違いがすごい気になりました。
オブジェクトか配列かの違い
そもそもの勘違いでpropsは配列リテラルではなく、オブジェクトリテラルが帰ってきている。というだけの話。
jsに慣れてないので、この値の違いがいまいちわからずハマってました。。。
まあ詳しくはjsの分割代入のリファレンス読んでください。
⇒https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
要はこういうこと(※簡単に理解するためのイメージです。)
props
props{
name : "山田太郎",
age : 20
};
useState()
let num = 1;
const setNum = (param) =>{
num = param;
}
// これをuseState()の戻り値として返してるイメージ
const state[num, setNum]
実際にそういう実装になってるとかっていう話ではないです。
ReactというかJavaScriptのお話でした。