収録問題 70問 ／ 10問ランダム出題
ランダムに出題・即時フィードバック・間違えた問題の復習機能付き
JavaScript・TypeScript実務のおすすめ教材を見る →
APIから得たIDが文字列か数値かを区別して比較したい。JavaScriptで適切な演算子はどれですか？
答え： 厳密等価演算子 ===
===は型変換を行わずに型と値を比較するため、文字列の"1"と数値の1を別物として扱えます。境界で型を正規化する設計も有効です。
設定値として0を有効な値にし、nullまたはundefinedのときだけ既定値を使いたい。適切なのはどれですか？
答え： value ?? defaultValue
null合体演算子は左辺がnullまたはundefinedの場合だけ右辺を返します。||は0、空文字、falseも既定値へ置き換えます。
ループ内で非同期コールバックを作り、各反復時のインデックスを保持したい。適切な宣言はどれですか？
答え： for文のインデックスをletで宣言する
letはforループの反復ごとに新しいバインディングを作るため、クロージャはその反復の値を保持します。varは一つのバインディングを共有します。
オブジェクトメソッド内でsetTimeoutを使い、メソッド呼出し時のthisを参照したい。適切なのはどれですか？
答え： setTimeoutへアロー関数を渡す
アロー関数は独自のthisを持たず、外側のメソッドコンテキストを字句的に参照します。通常関数のthisは呼出し方で決まります。
同期処理、Promise.then、setTimeout(fn, 0)を同時に登録した。一般的な実行順序はどれですか？
答え： 同期処理、Promiseのマイクロタスク、タイマーのタスク
現在のコールスタックが完了した後、マイクロタスクキューを処理し、その後にタイマーなど次のタスクへ進みます。長いマイクロタスク連鎖は描画やタスクを遅らせます。
独立した3つのAPIを並行実行し、1つ失敗しても全結果を確認したい。適切なのはどれですか？
答え： Promise.allSettled()
allSettledは各Promiseのfulfilledまたはrejected結果をすべて返します。全成功が必須ならPromise.allが適します。
検索入力が変わるたびに古いfetchを中止し、最新結果だけを表示したい。適切なのはどれですか？
答え： AbortControllerのsignalをfetchへ渡し、次回入力時にabortする
AbortSignalをfetchへ渡すと不要な通信と後続処理を中止できます。AbortErrorは通常の障害と区別し、表示更新には最新リクエスト識別も併用できます。
fetchでHTTP 404を業務エラーとして扱いたい。適切な処理はどれですか？
答え： Response.okまたはstatusを確認し、期待しないステータスなら明示的にエラー処理する
fetchはネットワークエラーでは拒否されますが、404や500のレスポンスでは通常fulfilledになります。HTTPステータスをAPI仕様に沿って判定します。
非同期関数で一時エラーをリトライする実装として適切なのはどれですか？
答え： 対象エラーと回数を限定し、バックオフとジッターを入れて最終失敗をthrowする
リトライは一時障害かつ安全な操作へ限定し、総時間と回数を制御します。失敗を握りつぶさず、呼出し側へ仕様どおり伝えます。
大きなレスポンスボディを段階的に処理し、メモリ使用量を抑えたい。適切なのはどれですか？
答え： ReadableStreamからチャンクを読み、バックプレッシャーを考慮して順次処理する
ストリーム処理は全データをメモリへ保持せず段階処理できます。デコーダーの文字境界、エラー、キャンセル、処理速度差も扱います。
オブジェクトの入れ子を含む状態を完全に独立コピーしたい。スプレッド構文だけでは不十分な理由はどれですか？
答え： スプレッドは浅いコピーで、入れ子オブジェクトの参照を共有する
{...obj}は直下プロパティをコピーしますが、入れ子の配列やオブジェクトは同じ参照です。対応データならstructuredCloneや目的別コピーを使います。
Date、Map、循環参照を含むクローン可能なデータをディープコピーしたい。適切なのはどれですか？
答え： structuredClone()を利用する
structuredCloneは構造化クローンAlgorithmに対応する多くの組込み型と循環参照を扱います。関数や一部ホストオブジェクトなど非対応値は確認が必要です。
キーが任意のオブジェクトであり、頻繁な追加・削除・反復が必要なコレクションに適するものはどれですか？
答え： Map
Mapはオブジェクトを含む任意型をキーにでき、サイズ、反復順、追加・削除APIが明確です。文字列キー中心のRecordならオブジェクトも適します。
DOM要素に関連データを持たせたいが、要素破棄後はGC可能にしたい。適切なのはどれですか？
答え： WeakMapを使い要素をキーにする
WeakMapのキーは弱参照で、他に参照されないオブジェクトのGCを妨げません。列挙できないため、全エントリ一覧が必要な用途にはMapを使います。
大量のリスト項目へクリック処理を追加し、後から追加されるアイテムにも対応したい。適切なのはどれですか？
答え： 親要素へリスナーを一つ置き、event.target.closest()で対象を判定する
イベント委譲はバブルを利用し、親の一つのリスナーで現在と将来の子要素を扱います。対象が親範囲内かも確認します。
利用者入力をテキストとしてDOMへ表示し、HTMLとして解釈させたくない。適切なのはどれですか？
答え： textContentへ代入する
textContentは入力をマークアップとしてパースせずテキストノードとして扱います。リッチHTMLが必要なら信頼できるサニタイザーとコンテキスト別対策が必要です。
外部入力のキーをオブジェクトへマージする処理でプロトタイプ汚染を防ぎたい。適切なのはどれですか？
答え： 許可キーをスキーマで限定し、__proto__・constructor・prototypeなど危険キーを拒否する
外部キーを動的パスへ使う場合は許可リストとスキーマ検証を行います。用途によってObject.create(null)やMapも防御層になります。
コンポーネント破棄後もウィンドウのイベントリスナーがコンポーネントを参照し続ける。適切な対策はどれですか？
答え： 同じリスナー参照でremoveEventListenerするかAbortSignalでライフサイクルに合わせて解除する
長寿命ターゲットのリスナーは短寿命オブジェクトへの参照を保持し得ます。登録時に解除方法を設計し、タイマーやオブザーバーも同様にクリーンアップします。
ESモジュール間で循環依存が発生し、初期化前バインディング参照エラーが起きた。適切な改善はどれですか？
答え： 共有する型定義を依存方向が一方向になる別モジュールへ分離し、トップレベル初期化の相互参照をなくす
ESモジュールのインポートはライブバインディングですが、循環したトップレベル評価では初期化順の問題が起こります。依存方向と初期化責務を整理します。
利用者入力のたびに検索APIを呼ぶ処理で、入力停止後に1回だけ実行したい。適切なのはどれですか？
答え： デバウンスし、新しい入力ごとに以前のタイマーを取消す
デバウンスはイベントが一定時間途切れた後に処理します。スクロール進捗など継続中も周期実行したい場合はスロットルが適します。
JSON.parseの結果をTypeScriptで安全に扱う入口の型として適切なのはどれですか？
答え： unknownとして受け、スキーマ検証や型ガードで絞り込む
TypeScriptの型はランタイム入力を検証しません。unknownは利用前の絞り込みを要求し、バリデーターで構造を確認してからドメイン型へ渡せます。
string | numberの値へ文字列メソッドを呼ぶ前に必要な処理はどれですか？
答え： typeof value === 'string'で絞り込みする
typeofチェックはランタイム条件と制御フロー分析を一致させ、分岐内でstringへ型を絞ります。アサーションは誤った実値を防ぎません。
読み込み・成功・失敗の状態と対応データを安全に表す型はどれですか？
答え： stateリテラルを持つ判別可能ユニオン
判別可能ユニオンならstate === 'success'の分岐でデータ型が確定し、不可能な状態の組合せを表現しにくくできます。
判別可能ユニオンへ新しいバリアントを追加したとき、未対応switchをコンパイルエラーにしたい。適切なのはどれですか？
答え： default分岐で残った値をneverへ代入する
全バリアント処理後の値はneverになります。新バリアントが未処理ならneverへ代入できず、Exhaustivenessチェックとしてコンパイルエラーになります。
IDプロパティを持つ任意型からIDを取得するジェネリック関数の制約として適切なのはどれですか？
答え： T extends { id: string }
構造的制約で必要なidを保証しつつ、呼出し元の追加プロパティを含む具体型Tを保持できます。
オブジェクト型Tに存在するプロパティ名だけを引数へ許可したい。使う型演算子はどれですか？
答え： keyof T
keyofはオブジェクト型の既知プロパティキーのユニオンを作ります。K extends keyof TとT[K]を組み合わせると型安全なプロパティ取得を表現できます。
既存型Userの全プロパティを省略可能にした更新DTOを作りたい。適切なのはどれですか？
答え： Partial<User>
Partialはマップ型で各プロパティを省略可能にします。ただし業務上更新可能なフィールドだけに限定するにはPickや専用DTOも検討します。
設定オブジェクトがRecord<string, string>を満たすか検査しつつ、各プロパティのリテラル推論を保ちたい。適切なのはどれですか？
答え： satisfies演算子
satisfiesは式が対象型へ代入可能か検査しながら、式自身のより具体的な推論型を維持できます。実行時検証ではありません。
HTTPメソッド配列を変更不可のリテラルタプルとして推論させたい。適切なのはどれですか？
答え： ['GET', 'POST'] as const
constアサーションは配列をreadonlyタプルとして、要素を文字列リテラルとして推論します。ランタイムで完全フリーズする機能ではありません。
strictNullChecksを有効にする主な効果はどれですか？
答え： nullとundefinedを独立した型として扱い、必要な場所で明示的な処理を要求する
strictNullChecksでは不在の可能性がユニオンへ現れ、チェックやオプショナルチェーンなどを要求します。外部データの実行時検証は別途必要です。
Record<string, User>から存在しないキーを読む危険を型へ反映したい。適切なtsconfigオプションはどれですか？
答え： noUncheckedIndexedAccess
noUncheckedIndexedAccessは未宣言キーのインデックスアクセスへundefinedを加え、存在チェックを促します。データ構造を実行時に変更するオプションではありません。
エラーオブジェクトか不明な値をcatchした後、安全にmessageを取得したい。適切なのはどれですか？
答え： value instanceofエラーで確認し、それ以外はString(value)など別処理にする
JavaScriptではエラー以外もthrowできます。unknownとして絞り込みすると、エラーのmessageへ安全にアクセスし、その他の値も記録できます。
再利用するランタイムチェックisUserの戻り値として、呼出し側をUserへ絞り込みしたい。適切なのはどれですか？
答え： value isUserという型述語
型述語を返す関数は、true分岐で引数を指定型へ絞り込みします。述語実装は必要プロパティを実際に検証する必要があります。
validateConfigが失敗時にthrowし、成功後は引数をConfig型として扱わせたい。適切な署名はどれですか？
答え： asserts value is Config
アサーション関数は正常return後に条件が成立するとコンパイラへ伝えます。実装が検証せずreturnすると型安全性を破壊します。
UserIdとOrderIdがどちらもstringだが、誤って渡すのを防ぎたい。適切な型設計はどれですか？
答え： 異なるブランドを交差させたブランド型を境界ファクトリから作る
TypeScriptは構造的型付けなので単純エイリアス同士は区別されません。ブランドを交差させ、検証済み生成関数から作ると混同を減らせます。
ライブラリから型としてだけ使うインポートを生成JavaScriptへ残したくない。適切なのはどれですか？
答え： import type { User } from './types'
import typeは型位置専用で発行時に削除され、ランタイム依存と型依存を明確に分けます。
型定義がない既存JavaScriptパッケージへ最小限の型を追加したい。適切なのはどれですか？
答え： 実際の公開APIに合わせた.d.tsのdeclare moduleを用意する
型定義ファイルはランタイム実装を記述せず、その形をコンパイラへ伝えます。実装バージョンと同期し、可能ならパッケージ側または型パッケージで管理します。
大規模リポジトリで複数TypeScriptプロジェクトのビルドを分離し、依存順にインクリメンタルビルドしたい。適切なのはどれですか？
答え： Project Referencesとcompositeプロジェクトを使う
Project Referencesはプロジェクト境界と依存を宣言し、tsc --buildで順序付きインクリメンタルビルドを可能にします。出力ディレクトリも分離します。
関数の引数がstringまたはstring[]で、戻り値は常にnumberである。設計として適切なのはどれですか？
答え： 引数をstring | string[]のユニオンにし、関数内で絞り込みする
戻り値が入力バリアントで変わらない単純な場合はユニオンが明確です。過負荷は入力によって戻り値関係が異なるなど、呼出し署名を分ける価値がある場合に使います。
TypeScriptで型チェックが通ったAPIレスポンスでも実行時検証が必要な理由はどれですか？
答え： 型アノテーションはコンパイル時に消え、外部レスポンスの実際の形を強制しないため
TypeScriptはJavaScriptへ変換される際に型が消えます。ネットワーク、ストレージ、利用者入力など信頼境界ではスキーマを検証し、成功後に型付きデータへ変換します。
ページネーションAPIを必要な分だけ順次取得し、呼出し側がfor await...ofで扱えるようにしたい。適切な設計はどれですか？
答え： 非同期ジェネレータで取得とyieldを繰り返す
非同期ジェネレータは非同期取得と反復を一つの境界にまとめ、利用側の消費速度に合わせて次ページを取得できます。途中終了時の後処理やAbortSignalも組み込みやすくなります。
利用者のキャンセル操作または5秒タイムアウトのどちらか早い方でfetchを中止したい。適切なのはどれですか？
答え： AbortSignal.anyでコントローラーのsignalとAbortSignal.timeoutを合成する
AbortSignal.anyは複数シグナルのいずれかが中断された時点で一つのシグナルを中断します。合成シグナルをfetchへ渡すと、利用者キャンセルとタイムアウトを同じ取消境界で扱えます。
独自のPromise APIへAbortSignal対応を追加する際、呼出し時点ですでに中断済みの場合も正しく扱う方法はどれですか？
答え： 開始前にthrowIfAbortedを確認し、abortリスナーを登録して完了時に解除する
AbortSignalは一度中断されると再利用できず、登録前に中断済みなら後からイベントを受け取れません。開始前確認とリスナー解除を組み合わせ、取消時はsignal.reasonで拒否します。
大量データをPromise.thenの連鎖だけで処理したところ、タイマーや描画が長時間進まない。主な改善はどれですか？
答え： 処理をチャンク化し、必要に応じてタスクキューへ制御を戻す
マイクロタスクキューは通常、次のタスクや描画へ進む前に空になるまで処理されます。無制限なマイクロタスク連鎖を分割し、タスク境界またはワーカーへ渡すと応答性を保てます。
画像解析のCPU負荷でメインスレッドの操作が固まる。ブラウザで適切な分離方法はどれですか？
答え： Webワーカーへ計算を移し、メッセージで結果を受け取る
Webワーカーは別スレッドでJavaScriptを実行でき、CPUバインド済み処理によるメインスレッドブロックを避けます。DOMへ直接触れないため、入力と結果はメッセージで受け渡します。
大きなArrayBufferをメインスレッドからワーカーへコピーコストを抑えて渡したい。適切なのはどれですか？
答え： postMessageの転送リストへArrayBufferを指定する
TransferableとしてArrayBufferの所有権を移すと、データコピーを避けられます。移動後の送信元バッファはデタッチされるため、送信元で再利用しない設計が必要です。
オフライン対応Webアプリで、検索可能な構造化データとトランザクションをブラウザへ保存したい。適切なのはどれですか？
答え： IndexedDB
IndexedDBは非同期のオブジェクトストア、インデックス、トランザクションを提供し、大きな構造化データのオフライン保存に適します。スキーマバージョン変更時のマイグレーションも設計します。
同一オリジンの複数タブでログアウトやテーマ変更を即時通知したい。単純な通知用途に適するAPIはどれですか？
答え： BroadcastChannel
BroadcastChannelは同一オリジン内のBrowsingコンテキスト間でチャネル名に基づくメッセージ交換を行えます。永続状態は別ストアを正本にし、チャネルは変更通知として使います。
ベースURLへ利用者入力の検索条件を安全にクエリパラメータとして追加したい。適切なのはどれですか？
答え： URLとURLSearchParamsを使って値を設定する
URL APIはベースとの解決を行い、URLSearchParamsはパラメータ値を適切にシリアライズします。文字列連結で起きるエンコーディング漏れや既存クエリとの区切り間違いを減らせます。
UTCタイムスタンプを利用者指定のタイムゾーンとロケールで表示したい。適切なのはどれですか？
答え： Intl.DateTimeFormatへlocaleとtimeZoneを明示する
Intl.DateTimeFormatはロケール固有の表示規則とIANAタイムゾーンを扱います。保存・通信は瞬間として保ち、表示境界でロケールとゾーンを適用します。
推測困難なセッショントークン用ランダム値をブラウザで生成したい。適切なのはどれですか？
答え： crypto.getRandomValuesまたはcrypto.randomUUIDを使う
Web CryptoのランダムAPIは暗号学的に強い乱数源を提供します。ただし認証セッションの発行・保管・失効はサーバー側の脅威モデルと併せて設計します。
大きな管理画面モジュールを、その画面へ遷移した利用者だけに読み込ませたい。適切なのはどれですか？
答え： import()で動的インポートし、チャンク分割境界にする
動的import()はPromiseでモジュール名前空間を返し、バンドラーが遅延チャンクの境界として扱えます。ルート単位で分割し、読み込み・エラー・事前読込も設計します。
公開パッケージの内部パスへのインポートが利用者コードに広がり、内部構成変更で破壊される。適切な対策はどれですか？
答え： package.jsonのexportsで公開エントリポイントを明示する
exports Mapはパッケージが支援するインポートパスを公開仕様として限定し、内部実装を隠せます。ESM/CJSや型定義の条件分岐は利用ランタイムとツールチェーンで検証します。
省略可能プロパティの『キーがない』と『キーはあるがundefined』を区別するAPI仕様を型で守りたい。適切な設定はどれですか？
答え： exactOptionalPropertyTypesを有効にする
exactOptionalPropertyTypesはprop?: Tを、明示的なundefined代入を含む型ではなくプロパティ不在として厳密に扱います。undefinedも値として許すなら型へ明示します。
ベースクラスのメソッド名変更後、サブクラス側に古い同名メソッドが偶然残る事故をコンパイル時に検出したい。適切なのはどれですか？
答え： noImplicitOverrideを有効にしoverride修飾子を要求する
noImplicitOverrideはオーバーライドするメンバーへ明示的なoverrideを要求します。ベース側変更でオーバーライド関係が崩れた際に、意図しない独立メソッドとして残る問題を検出しやすくします。
戻り値stringの関数で、一部の条件分岐だけreturnを忘れる事故を検出したい。適切なコンパイラオプションはどれですか？
答え： noImplicitReturns
noImplicitReturnsは関数内のすべてのコードパスが値を返すか確認します。明示した戻り値型やstrictNullChecksと併用し、欠落を早期に検出します。
Promise<T>から解決後のTを取り出す独自ユーティリティ型を定義したい。適切な型機能はどれですか？
答え： 条件型内でinferを使う
T extends Promise<infer U> ? U : Tのように条件型でパターンへ一致させ、inferで内部型を導出できます。標準のAwaited型が要件を満たす場合はそちらを優先します。
オブジェクトのプロパティ名nameからイベント名nameChangedを作り、コールバック引数を元プロパティ型へ結び付けたい。適切なのはどれですか？
答え： keyofとテンプレートリテラル型をジェネリックに組み合わせる
テンプレートリテラル型は文字列リテラルユニオンを組み立てられます。${string & keyof T}Changedとキー推論を使うと、イベント名とT[Key]の型関係を表現できます。
ライブラリ関数へオブジェクトリテラルを渡した際、呼出し側にas constを要求せずリテラルタプルを保って推論したい。適切なのはどれですか？
答え： const型パラメータを使う
TypeScriptのconst型パラメータは、インライン引数からより具体的なリテラル・readonlyタプルを既定で推論させます。制約もreadonly形にして意図した推論を保ちます。
esbuildやBabelでファイル単位にトランスパイルし、tscは型チェックだけ行う構成で、単一ファイル変換できないTypeScript記述を検出したい。適切なのはどれですか？
答え： isolatedModulesを有効にする
isolatedModulesは、他ファイルの型情報なしに安全に変換できない記述へ警告します。トランスパイルをバンドラーへ任せる構成でも、tscの全プロジェクト型チェックは別工程で継続します。
配列のforEachへasync関数を渡して保存処理を呼びましたが、保存完了前に完了メッセージが出ます。順番に1件ずつ保存し、全部終わってから通知するにはどうしますか？
答え： for...ofの各反復で保存をawaitし、ループ後に通知する
forEachはコールバックが返したPromiseを待ちません。逐次実行が必要ならfor...of内でawaitします。保存失敗時は例外が伝播するため、成功通知と失敗時の対応も分けます。
Promise.allで二つの通信を開始し、一つが失敗しました。他方の通信が自動的に中止されたと考えてよいですか？
答え： 全体は拒否されるが、他方の処理はそれだけでは中止されない
Promise.allは入力の拒否を受けて拒否されますが、実行済み処理を取り消す機能ではありません。中止したいなら対応APIへAbortSignal等を渡します。サーバー側で確定した処理まで取り消せるとは限りません。
数値配列[3, 20, 100]をsort()したところ[100, 20, 3]になりました。数値の昇順にするにはどうしますか？
答え： sort((a, b) => a - b)で数値の比較関数を渡す
既定のsortは文字列へ変換した比較です。有限の数値を昇順にするならa-bの比較関数を渡します。sortは元の配列を変更するため、元の順序を残す必要があれば先に配列を複製します。
Array(3).fill({count: 0})で行データを作り、1行目のcountを変えると全行が変わりました。各行を独立したオブジェクトにするにはどうしますか？
答え： Array.fromの生成関数内で、行ごとに新しいオブジェクトを作る
fillは同じオブジェクト参照を各要素へ入れます。Array.from({length: 3}, () => ({count: 0}))なら各呼び出しで別オブジェクトを生成できます。配列だけの浅いコピーでは参照の共有は解消しません。
JSON.stringify({name: undefined})でAPIの項目削除を伝えようとしたところ、name自体が送られませんでした。nullを削除指定とするAPIではどうしますか？
答え： nameへnullを明示して設定し、API仕様に従って送信する
オブジェクトのundefined値のプロパティは通常JSON化で省略されます。nullはJSONに残るので、設問のAPI仕様なら{name: null}を送ります。省略・null・空文字列の意味はAPIごとに確認します。
TypeScriptのReadonly<User>で受け取ったオブジェクトが、別のJavaScriptコードから変更されました。readonlyの説明として正しいのはどれですか？
答え： readonlyは型検査上の制約であり、実行時の凍結ではない
readonlyはその型を通した代入を型検査で制限します。実行時のオブジェクトを凍結したり、別の参照からの変更を防いだりはしません。実行時の保護が必要なら所有権やコピー、凍結の深さを別途設計します。
fetchのResponseでtext()を呼んで本文を読んだ後、同じResponseのjson()が失敗しました。本文を文字列としてもJSONとしても使う基本的な方法はどれですか？
答え： 一度読んだ文字列を保持し、その文字列をJSON.parseする
Response本文はストリームで、一度消費すると同じ本文を読み直せません。小さなJSONならtextで一度読み、必要に応じてJSON.parseします。別々の読み取りが必要な場合は消費前のcloneも選択肢ですが、容量に注意します。
設定オブジェクトのキーが、自身のプロパティとして存在するかを調べたいと考えています。プロトタイプから継承したキーは除外する方法はどれですか？
答え： Object.hasOwn(config, key)で、自身のプロパティを確認する
Object.hasOwnは継承を除いた自身のプロパティの有無を調べます。値が0やfalseやundefinedでも、キー自体があるならtrueです。nullプロトタイプやhasOwnPropertyという名前のキーを持つ場合にも使えます。
APIがNumberの安全な整数範囲を超えるIDを数値で返し、JSON.parse後に別IDと区別できなくなりました。識別子の精度を守る設計はどれですか？
答え： APIからIDを文字列で送り、識別子として文字列のまま扱う
数値として精度を失った後に文字列やBigIntへ変換しても、元の桁は戻りません。算術不要の識別子はAPI契約から文字列にするのが明確です。演算が必要なら、損失なく受け取った文字列からBigInt等へ変換します。
try内で例外をthrowしたのに、finallyでreturnした関数が成功値を返していました。元の失敗を隠さない設計はどれですか？
答え： finallyは後始末に使い、元の例外を上書きするreturnを置かない
finallyのreturnはtryやcatchで決まった戻り値・例外を上書きします。後始末を行い、必要な失敗が呼び出し元へ伝わるようにします。後始末自体の例外も元の原因を隠し得るため、失敗の保持方針を設計します。