モダンJavaScriptの基礎から始める挫折しないためのReact入門 60日コース | モダンJavaScript基礎 - DAY 3:関数

React 60日で身につけるReact
スポンサーリンク
スポンサーリンク
  1. DAY 3:関数(前半)
  2. 関数とは
    1. 処理に名前をつけて「ひとまとまり」にしたもの
  3. 関数定義
    1. 基本形:function キーワードを使った書き方
  4. 引数
    1. 関数に渡す「入力値」
    2. 引数があることで「再利用性」が一気に上がる
  5. 戻り値
    1. 関数が「外側に返す結果」
  6. return
    1. 「結果を返す」と同時に「そこで関数を終わらせる」
    2. 「console.logで終わらせない」癖をつける
  7. 関数を再利用する考え方
    1. 「同じ処理を何度も書いていないか」を常に意識する
    2. 「小さく分けて、組み合わせる」発想
  8. DAY 3(前半)のまとめと後半へのつながり
  9. DAY 3:関数(後半)
  10. 関数とは(ロジックを整理するための「単位」として考える)
    1. 関数を4つの要素で捉える
  11. 関数定義(コードを書く前に「日本語で説明する」)
    1. まずは言葉で「何をどうする関数か」を言ってみる
  12. 引数(「変えたいところ」を外から渡す)
    1. 固定部分と可変部分を分けて考える
    2. 引数の数を増やしすぎない
  13. 戻り値とreturn(「結果を外に渡すための出口」)
    1. 「結果を返す関数」と「処理だけする関数」
    2. returnで「早めに抜ける」テクニック
  14. 関数を再利用する考え方(「小さく分けて、組み合わせる」)
    1. 1関数1役割を意識する
    2. 小さな関数を組み合わせる例
  15. Reactとのつながり:コンポーネントは「UIを返す関数」
    1. コンポーネントも「関数+引数+戻り値」
    2. コンポーネントの中で関数を使う
  16. DAY 3(後半)のまとめと次へのつながり
  17. DAY 3:関数とミニ課題まとめ
  18. 関数とは(ミニ課題に向けたイメージづくり)
    1. 処理に名前をつけて「ひとまとまり」にするもの
  19. 関数定義(ミニ課題のための基本形)
    1. function キーワードを使った基本形
  20. 引数(「毎回変わる値」を外から渡す)
    1. 固定部分と可変部分を分けて考える
  21. 戻り値とreturn(結果を外に渡す)
    1. 「結果を返す関数」としてミニ課題を設計する
  22. 関数を再利用する考え方(ミニ課題を組み合わせる)
    1. 1関数1役割を意識して、組み合わせて使う
  23. ミニ課題:4つの関数をステップで作る
    1. 足し算関数:add
    2. 税込価格計算関数:calcTaxIncluded
    3. 偶数判定関数:isEven
    4. 最大値判定関数:max
  24. 関数を組み合わせて再利用する例
    1. 小さな関数をつなげて「少し大きな処理」を作る
  25. DAY 3ミニ課題のまとめと次へのつながり

DAY 3:関数(前半)

DAY 3の前半では、「関数とは何か」「関数の定義」「引数」「戻り値」「return」「関数を再利用する考え方」を、できるだけイメージしやすく整理していきます。 JavaScriptにおいて関数は、ほぼすべてのロジックの“基本単位”になります。Reactコンポーネントも「UIを返す関数」として定義されるので、ここでの理解がこの先の学習に直結していきます。

タイトルとURLをコピーしました