TypeScript

以前Optoin型について書きました。こちら

今回はOption型をどのような時に使うのか、なぜ使うのかについて自分なりに考えてみました。

とあるシステムで、商品番号を取得して返す関数があるとします。

TypeScript

Option 型は、値があるかもしれないし、ないかもしれないことを表現する型です。

TypeScript でこの型を作成する場合は、オブジェクト型(タグ付き)のユニオン型を作ります。

以下が Option 型の ...

TypeScript

as const は TypeScript の安全性を高めてくれます。

特に有用なのは、widening してしまうところを防止する効果があります。

const name1 = //string as const// ...

React, TypeScript

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

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

TypeScript

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

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

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

TypeScript

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

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

class Parent { getHog ...

TypeScript

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

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

const i ...

TypeScript

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

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

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

TypeScript

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

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

TypeScript

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

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

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