TypeScript Option 型の有用性について考えてみた
以前Optoin型について書きました。こちら
今回はOption型をどのような時に使うのか、なぜ使うのかについて自分なりに考えてみました。
とあるシステムで、商品番号を取得して返す関数があるとします。
TypeScript で Option 型をできるだけわかりやすく
Option 型は、値があるかもしれないし、ないかもしれないことを表現する型です。
TypeScript でこの型を作成する場合は、オブジェクト型(タグ付き)のユニオン型を作ります。
以下が Option 型の ...
TypeScript as const の代表的な効果
as const は TypeScript の安全性を高めてくれます。
特に有用なのは、widening してしまうところを防止する効果があります。
const name1 = //string as const// ...
React V18 から VFC が非推奨になっていた
React V18 から、FC に暗黙的に含まれていた children がなくなり、VFC と同等になりました。
つまり、コンポーネントで children を使う場合は props の型定義に明示的に children ...
TypeScript + diff-match-patch で差分検知
diff-match-patch を TypeScript で使った簡単なサンプルです。
diff-match-patch はテキスト同士の比較をできる便利なライブラリです。
差分をhtmlに出力できます。
TypeScript のoverride 修飾詞について
TypeScript には override 修飾詞というものがあります。
以下のように、親クラスのメソッドをオーバーライドしているときにこの修飾詞をつけることができます。
class Parent { getHog ...
TypeScript unknown の値からプロパティへアクセスするまで
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 4.8 から変わる unknown の動き
unknown はすべての型を包括しています。
そして、{} は null と undefined 以外のすべての型を指します。
つまり、null | undefined | {} はすべての型を指すので理論上 ...