点数
92点
感想
前半はJavaScriptやReactの基礎についての説明が多く、やや物足りない内容だった。
後半はCSS問題・コンテキスト・メモ化・TypeScript・カスタムフックなど重要なものがきっちりと解説されていた。
全体的に丁寧でわかりやすく、素晴らしい書籍だと思う。
JavaScript
es2015の復習
分割代入
const name = user.name
const age = user.age
// が以下で書けるようになった。
const { name, age } = userオブジェクトの省略記法
const user {
name: name
}
// が以下で書けるようになった。
const user {
name
}スプレッド構文
myFunc(arr[0], arr[1]) // が以下で書けるようになった。 myFunc(…arr) // 配列・オブジェクトのコピー・結合はスプレッド構文を使うべき。 const arr2 = […arr] const arr5 = […arr3, …arr4]配列のmapメソッドとfilterメソッド
- map: returnされた値を要素とする配列を生成
- filter: trueがreturnされた要素だけの配列を生成
Reactの基本
環境構築
- npx create-react-app my-app
- cd my-app
- mkdir components
- npm start
propsの書き方
- デフォルト
const Sample = (porps) => {
console.log(porps.msg) - 分割代入で変数に格納する
const Sample = (porps) => {
const { msg, color } = props - 仮引数自体を分割代入にする
const Sample = ({ msg, color }) => {
useEffect
useEffectはレンダリングの際に処理を実行するためのものである。
第2引数の依存配列によって、実行されるタイミングが異なる。
- なし: mounted, updated
- 空配列: mounted
- 配列: 変数が更新された時
useEffect(()=>{
console.log('useEffect')
}, [num]);