Back to posts

React学習メモ

IT業界に転向してから2現場目にしてReact + TypeScriptに触れさせてもらえる機会に恵まれたので、
学習内容などを個人ブログでまとめていく。

React

JSXのルール

  • 唯一のルート要素

キーワード

  • 分割代入、ミニフィケーション、ダイジェスト付与、Optional Chaining演算子
  • スプレッド構文

constの性質

  • 「変更できない」ではなく、「再代入できない」
  • そして、letかconstなら、constを優先すべき

  • JavaScriptは中身はEcmaScript
  • ES 2015以降のJavaScriptはモダンJavaScritptと言われる

  • Reactの理解が難しいなら、実はモダンJSを理解できていないだけかも?(よくあるらしい)

テンプレート文字列とは

文字列リテラルを``(バッククォート)で括る記法

  • 文字列内に$(変数名)という形で変数を埋め込める
  • \nを使わずに改行も可能

  • タグ付きテンプレート文字列というのもある

アロー関数

関数リテラルをより簡単に表すための記法

以下のコードは意味的にはほぼ同義となる

function 関数名(引数){
    return 処理;
}
const 関数名 = (引数) => {
    return 処理;
}

さらに、関数の処理が一文ならブロック {}は省略できる

const 関数名 = (引数) => 処理;

さらに、引数が1個なら引数のカッコも省略できる

const 関数名 = 引数 => 処理;

引数が無い場合は、カッコのみ記述する

const 関数名 = () => 処理;

基本的にできるだけ最も簡略化された形で記述するのが望ましいとされる。
特に最後のはよく見るが、初見だと意味が分からなくて戸惑う。
(Javaのラムダ式にも似ているような)