TypeScriptの記事一覧

MSW v2 で `HttpResponse.json()` の型がおかしいときの対処法

MSW v2 の `HttpResponse.json()` の第 2 引数の型は `Response` オブジェクトの初期化時に渡すオプションを指定できます。しかし、tsconfig.json の設定によっては、この型がおかしくなることがあります。その場合には、`tsconfig.json` の `compilerOptions.lib` に `dom` を追加するのが一時的な対処法です。

おまえら禁じられたインデックスアクセスを平気で使ってんじゃねえか!わかってんのか?『ランタイムエラー』が生まれたのは人間がコンパイラオプションに甘えたせいだろうがよ!

TypeScript 4.1 から noUncheckedIndexedAccess オプションが追加されました。このオプションは上記のような配列のアクセスやオブジェクトのプロパティのアクセスをより厳密にします。 具体的には、配列に対するインデックスアクセスやインデックスシグネチャを通じたプロパティのアクセスは常に `undefined` とのユニオン型となります。

【Vue.js】script setup 構文がすごくすごい

Vue.js 3.x から script setup 構文が使えるようになりました。これは単一ファイルコンポーネント(SFC)内で Composition API を使用している際に使える糖衣構文です。下記のようなメリットを得ることができ、公式からも使用が推奨されています。

【Svelte + TypeScript + tailwindcss】本検索サイト チュートリアル

この記事でははSvelte + TypeScript + tailwindcssで本検索サイトを作成します。 Svelteを使ってアプリケーションを作成1から作成することができます。 以下のことが学べます。 - Svelteの基礎文法 - Svelteのルーティング - Svelteのストア HTML・CSS・JavaScriptの基礎的な理解がある人が対象です。

JavaScriptライブラリ Svelteとは

Svelteとは、ReactやVue.jsのような宣言的UIライブラリの一種です。その最大の特徴は、ReactやVue.js・Angularと異なりSvelteはコンパイラであることを謳っているところです。Svelteによってコンパイルされたコードは、すべてVanilla JS - ネイティブのJavaScript- にで生成されます。 そのため、コンパイル後のファイルサイズも小さくパフォーマンス上での利点が期待されています。

import type { ... } from "./module" とは何者何か

TypeScript のプロジェクトにおいて `import type { ... } from "./module"` という記述を見たことはないでしょうか? これは Type-Only imports and export と呼ばれる機能で TypeScript3.8 より導入されました。これは名前の通りモジュールから型情報のみをインポートするために使用されます。これは通常の利用用途ではあまり考慮する必要はないのですが、特定の問題に立ち向かうために利用されることがあります。

【TypeScript】type-challenges で学ぶ高度な型

type-challengesを知っていますか? これは TypeScript の型についての問題集で、問題文の条件を満たす独自のユーティリティ型を作るチャレンジです。いわゆる「型パズル」ってやつですね。 問題の回答はPlayground上で行えるので実際に手を動かしながら問題を解くことができます。型パズルを通じてTypeScript の高度な型について学んでいきましょう。

Q: TypeScript を使っているのに関数の引数のオブジェクトや配列に `readonly` を付与しないのは犯罪ですか? #Shorts

質問来てた👉 Q: TypeScript を使っているのに関数の引数のオブジェクトや配列に `readonly` を付与しないのは犯罪ですか? 結論:犯罪になる場合がある。 まず、配列の引数に `readonly` を付与しておけば以下の利点を得られます。 - うっかり関数の内部で引数の値を変更してしまうコードを書いてしまったときにコンパイルエラーが得られる - 関数の利用者が安心して関数を呼び出せる

【TypeScript】型定義をする際にもDRY原則を守る

DRY原則は非常に有名な原則ですし、普段から特に考えずとも自然と重複をさけるようなコードを書いている方も多いことでしょう。 とはいえ、TypeScriptにおいて`interface`や`type`などを用いて型定義を行う際に重複した型定義を行ってしまうことはないでしょうか? TypeScriptには型定義をする際に重複を抑える手段は確かに存在します。そのようないくつかの方法を紹介します。