TypeScript

React V18 から、FC に暗黙的に含まれていた children がなくなり、VFC と同等になりました。

つまり、コンポーネントで children を使う場合は props の型定義に明示的に children ...

diff-match-patch を TypeScript で使った簡単なサンプルです。

diff-match-patch はテキスト同士の比較をできる便利なライブラリです。

差分をhtmlに出力できます。

TypeScript には override 修飾詞というものがあります。

以下のように、親クラスのメソッドをオーバーライドしているときにこの修飾詞をつけることができます。

class Parent { getHog ...

unknown 型の値に対してプロパティアクセスするとエラーになるのでそれを防止する方法です。

Record<string, unknown>型ガードを使ってとして挙げることでこれを回避します。

const i ...

インデックスシグネチャを安易に使わない方が良いという話です。

以下のコードはTypeScriptの型推論と実際の挙動が一致しません。

type T1 = { : boolean}const obj: T1 = { h ...

以下のコードは、T1 は hoge プロパティは string でそれ以外は number としたい意図です。

type T1 = { hoge: string} & { : number}const a: T1 = { hog ...

unknown はすべての型を包括しています。

そして、{} は null と undefined 以外のすべての型を指します。

つまり、null | undefined | {} はすべての型を指すので理論上 ...

TypeScript で if と swtich のどちらを使うかの一つのポイントについて紹介です。

前提として、以下があるとします。

ある関数があり、その関数の引数にユニオン型を受け取る
関数内ではユニオン型 ...

TypeScriptを使う場合は、普通は設計である型を先に定義し、それを元に実装をします。

しかし、逆に実装から型を作った方が良いケースもあります。そういう場合は typeof を使います。

type T1 = &# ...

TypeScriptの少し変わった書き方です。

タプル型から、要素のユニオン型を作成します。T1のところがミソです。

type T1 = type T2 = T1//"hoge" | " ...