サンプルコード
JavaScript のサンプルコード一覧
JavaScript で「○○するには」を解決するコードサンプル。59 件。
他の言語から探す
文字列を分割するには
`String.prototype.split` は区切りに文字列と正規表現のどちらも渡せる。第2引数の `limit` は Python の `maxsplit` と違って「返す配列の長さの上限」であり、あふれた分は切り捨てられて復元できない。先頭だけ取り出して残りをまとめたいときは、分割してから分割代入で受けるほうが安全である。
文字列をUTF-8のバイト列にするには
`TextEncoder` は常に UTF-8 でバイト列（`Uint8Array`）を作り、`TextDecoder` で戻せる。文字列の `length` は UTF-16 の単位数なので、絵文字を含むと見た目の文字数より大きくなる。`TextDecoder` は壊れたバイト列を既定で U+FFFD に置き換えるが、`fatal: true` を渡すと `TypeError` で止まる。
文字列をBase64にするには
Node.js では Buffer を介して変換し、文字列は Buffer.from(text, "utf8") でバイト列にしてから toString("base64") を呼ぶ。URL セーフ版は "base64url" を指定でき、こちらは末尾の = が付かない。ブラウザ由来の btoa は Latin-1 の範囲の文字しか受け付けず、日本語を渡すと InvalidCharacterError になる。
ファイルの文字コードを変換するには
TextDecoder に shift_jis を渡して読み、文字列を UTF-8 で書き出す。TextDecoder は Shift_JIS を読めるが、TextEncoder は UTF-8 にしか書き出せないため、この方法は UTF-8 から Shift_JIS へ戻す向きには使えない。
HTMLの特殊文字をエスケープするには
標準の HTML エスケープ関数が無いため、対象の 5 文字を対応表で置き換える関数を用意する。正規表現で 1 回の走査にまとめておけば、& を先に置き換えた結果を後続の置換が壊す順序の問題が起きない。
HTTP GETリクエストを送るには
Node.js 18 以降はグローバルの fetch がそのまま使えるので、外部パッケージは不要である。res.ok を先に見るのは、fetch が 404 や 500 でも reject せず解決してしまうため、確認を挟まないとエラー本文を正常なデータとして扱ってしまうからである。
文字列をURLエンコードするには
クエリの値や単独のパラメータには encodeURIComponent を使う。encodeURI は URL 全体を渡す前提で & や = を残すため、値に使うと区切り文字が混ざる。複数のパラメータを組み立てるなら URLSearchParams に任せるのが安全である。
日付を書式付きの文字列にするには
標準の Date には任意書式への変換が無いため、固定の書式なら getFullYear 等を連結して自前で組む。表示用の文字列なら Intl.DateTimeFormat を使うと、ロケールごとの適切な並びを自分で扱わずに済む。
文字列の長さを取得するには
String.length は UTF-16 の単位数を返すため、絵文字のようにサロゲートペアになる文字は 2 と数えられる。コードポイントで数えるなら展開してから length を見て、見た目の 1 文字で数えるなら Intl.Segmenter を使う。バイト数は TextEncoder で UTF-8 に変換して取る。
ファイルが存在するか調べるには
fs/promises の stat は対象が無いと ENOENT で reject するので、catch で false に倒して真偽値にする。同期版の existsSync は手軽だがイベントループを止めるため、非同期処理の中では避ける。
UNIXタイムスタンプを日付に変換するには
Date コンストラクタが受け取るのはミリ秒なので、エポック秒は 1000 倍して渡す。toISOString は常に UTC の文字列を返し、地域の時刻で表示したいときは toLocaleString に timeZone を指定する。
配列に要素が含まれるか調べるには
includes は真偽値を返し、NaN も見つけられる。indexOf は === で比較するため NaN を見つけられず、見つからないときは -1 を返す。オブジェクトの配列は参照で比べられるので、中身で探すときは some に条件を書く。
現在時刻を取得するには
new Date() は実行環境のタイムゾーンに紐づく「その瞬間」を表す。toISOString() は必ず UTC へ変換した文字列を返すので、画面に出す地域時刻が欲しいときは toLocaleString を使い分ける。
ディレクトリを作成するには
fs の mkdir は recursive: true を付けると親までまとめて作り、既にあっても失敗しない。戻り値は最初に新しく作ったディレクトリのパスで、すべて既にあったときは undefined になるため、新しく作ったかどうかの判定にも使える。
環境変数を読むには
Node.js では環境変数は process.env にまとまっており、未設定のキーは undefined になる。?? や || で既定値を補う。ブラウザには process が無く、Vite なら import.meta.env のようにバンドラが置き換える仕組みを使う。
配列をソートするには
Array.prototype.sort は比較関数を渡さないと要素を文字列に変換して比較するため、数値はそのままだと辞書順になる。数値順にするには (a, b) => a - b を渡す。sort は破壊的なので、元の配列を残すならスプレッドでコピーしてから並べ替える。
数値をゼロ埋めするには
padStart は文字列のメソッドなので、数値は String で文字列にしてから呼ぶ。padStart は符号を区別せず先頭に文字を足すだけで、-42 は 00-42 になるため、負の数を扱うなら符号を外して埋めてから付け直す。Intl.NumberFormat の minimumIntegerDigits でも埋められるが、こちらは符号を桁数に数えないので -42 は -00042 になる。
数値を指定した範囲に収めるには
Node.js 22 の Math には clamp が無いので、Math.max で下限に持ち上げてから Math.min で上限に抑える。Math.max と Math.min は引数を数値に変換してから比べるため、"150" は 100 になり、数値にならない "abc" は NaN のまま返る。
文字列を置換するには
replace は置換対象を文字列で指定すると最初の1回しか置換しない。全置換には replaceAll を使うと、正規表現を持ち出さずに意図が明確になる。
数値を3桁区切りにするには
toLocaleString と Intl.NumberFormat は、渡したロケールの規則で区切り文字と小数点を決める。ロケールを省略すると実行環境の設定に従い、サーバーとブラウザで表示が変わることがあるので明示する。小数部は既定で 3 桁までに丸められ、桁数は maximumFractionDigits で変えられる。正規表現で区切る書き方は整数部と小数部を区別しないため、小数部が 4 桁以上あると 1,234.5,678 のように壊れる。
整数の割り算で商と余りを求めるには
JavaScript の数値には整数型が無いので、/ で割った結果を Math.trunc で切り捨てて商にし、余りは % で求める。% の余りは割られる数と同じ符号になり、-17 % 5 は -2 である。0 で割っても例外にはならず、/ は Infinity、% は NaN を返すので、割る数が 0 でないことを先に確かめる。BigInt どうしの / は小数部を切り捨てて商を返し、0n で割ったときは RangeError になる。
小数を指定桁で丸めるには
Math.round は整数にしか丸めないので、100 倍して丸めてから 100 で割り戻す。ちょうど 0.5 のときは +∞ の側へ寄せるため、Math.round(-2.5) は -3 ではなく -2 になる。toFixed は丸めた結果を文字列で返し、内部で 1.00499… になっている 1.005 は 1.00 になる。Node.js で実行すると Intl.NumberFormat は 1.005 を 1.01 と書式化するので、表示だけが目的ならこちらを使う。
JSONをパースするには
JSON.parse は文字列だけを受け取るため、ファイルは先にテキストとして読み込む必要がある。トップレベル await を使う場合はファイルが ESM として扱われている必要がある。
環境変数を真偽値として読むには
Boolean() や !! で変換すると、"false" も空でない文字列なので true になる。Node.js には文字列を真偽値に解釈する標準関数が無いため、受け付ける値を Set で決めて比較し、それ以外は例外にして設定ミスに気づけるようにする。
パスからファイル名を取り出すには
path.basename は最後の要素を返し、第 2 引数に拡張子を渡すとそれを取り除いた名前になる。第 2 引数は大文字小文字を区別して末尾と比べるので、photo.JPG に .jpg を渡しても何も削られず、拡張子が決まっていないときは path.extname の結果を渡す。ESM では __filename が定義されないため、自分自身のファイル名は import.meta.filename（Node.js 20.11 以降）から取り出す。
ファイルに書き込むには
Node.js の fs/promises を使う書き方で、ブラウザでは動かない。writeFile は既存ファイルを上書きするため、追記したいときは appendFile を使う。
ファイルを読み込むには
Node.js の fs/promises を使う書き方で、ブラウザでは動かない。第2引数にエンコーディングを渡すと Buffer ではなく文字列が返る。
JSONをファイルに保存するには
JSON.stringify で文字列を作ってから writeFile で一時ファイルに書き、rename で置き換える。JSON.stringify は変換を終えてから文字列を返すので、BigInt のように変換できない値があれば書き込む前に TypeError で止まり、ファイルには触れない。Map と Set は例外にならず {} として保存されて中身が消えるため、保存する前に Object.fromEntries や配列へ変換しておく。
HTTPでファイルをダウンロードするには
Node.js 18 以降のグローバル fetch で取得し、Web のストリームである res.body を Readable.fromWeb で Node.js のストリームに変えてから、pipeline でファイルへ流し込む。fetch は 404 や 500 でも reject しないので、res.ok を確かめずに保存するとエラーページの HTML がそのままファイルになる。pipeline はどちらかのストリームでエラーが起きたときに両方を閉じるため、pipe を手でつなぐより後始末が確実である。
正規表現で大文字小文字を区別せずに一致させるには
リテラルなら閉じスラッシュの後ろに i フラグを付け、文字列からつくるなら new RegExp の第 2 引数に "i" を渡す。JavaScript は (?i) のインラインフラグに対応しておらず、パターンに書くと構文エラーになるのでフラグ側で指定する。
配列の最大値と最小値を求めるには
Math.max と Math.min は配列ではなく引数を並べて受け取るので、スプレッド構文で展開して渡す。空配列でも例外にならず -Infinity と Infinity が返るため、結果をそのまま使う前に空かどうかを確かめる。展開した引数が多すぎると RangeError になるので、要素数が読めない配列は reduce で比べる方が安全である。
親ディレクトリのパスを取得するには
path.dirname は最後の要素を取り除いたパスを返し、末尾の区切り文字は無視する。ESM では __dirname が定義されないため、import.meta.url を fileURLToPath でファイルパスに直してから dirname に渡す。Node.js 20.11 以降なら import.meta.dirname で同じ値が得られる。
相対パスを絶対パスにするには
path.resolve は右側の要素から順に前へつなぎ、絶対パスになった時点で止め、最後まで絶対パスにならなければ process.cwd() を前に付ける。ファイルが実在するかは確かめず、シンボリックリンクも解決しないので、実体のパスが必要なら fs.realpath を使う。
ファイルの拡張子を取り出すには
path.extname は最後のドット以降をドット付きで返し、拡張子が無い名前や .bashrc のようにドットで始まるだけの名前では空文字を返す。URL 文字列にそのまま使うとクエリ文字列まで拡張子に含まれてしまうので、URL オブジェクトの pathname から取り出す。
パスを連結するには
path.join は要素をつないだあとで余分な区切り文字や .. を正規化する。ESM では __dirname が使えないため、スクリプトの場所を基準にしたいときは Node.js 20.11 以降で使える import.meta.dirname を先頭に置く。
日付に日数を足すには
Date に日数を足す専用のメソッドは無く、setUTCDate(getUTCDate() + n) で日の値を増やす。範囲を超えた分は翌月へ繰り上がる。setUTCDate は呼び出した Date 自体を書き換えるので、元の日付を残したいときは new Date(d) で複製してから操作する。
ファイルをコピーするには
copyFile は既定で宛先を上書きするため、事故を避けたいときは第 3 引数に COPYFILE_EXCL を渡して既存時に EEXIST で失敗させる。親ディレクトリが無いときの ENOENT まで握り潰さないよう、catch では err.code を見てから再 throw する。
文字列を数値に変換するには
Number は文字列全体が数値として読めるときだけ数値を返し、読めなければ例外ではなく NaN を返す。空文字が 0 になる点と、parseInt が "42px" のように途中まで読んで打ち切る点が食い違いの原因になりやすいので、入力検証では Number と Number.isNaN を組み合わせて判定する。
2つのJSONをマージするには
スプレッド構文は最上位のキーだけを見る浅いマージで、値がオブジェクトでもそのまま差し替わる。入れ子を残したいときは、両辺がプレーンなオブジェクトのときだけ再帰する関数を書く。配列を統合対象から外すため isPlainObject で Array を弾いている。
環境変数の一覧を取得するには
process.env は素のオブジェクトなので Object.entries や Object.keys で回せる。順序は登録順で安定しないため、比較や表示に使うときは名前で並べ替えてから出す。
正規表現に一致する部分をすべて取り出すには
matchAll は g フラグが無いと TypeError になるため、全件を取りに行くときは必ず /g を付ける。match に g を付けても全件は取れるが、その場合の戻り値は一致全体の配列でキャプチャグループは失われる。
HTTPリクエストにタイムアウトを設定するには
fetch 自体にタイムアウトの引数は無いので、AbortSignal.timeout でシグナルを作って渡す。時間切れのときは name が "TimeoutError" の DOMException が飛び、自分で abort したときの "AbortError" と区別できる。
正規表現で部分文字列を取り出すには
match の戻り値は配列で、m[0] が一致全体、m[1] 以降がグループである。(?<name>...) と書けば m.groups.name でも引ける。全件を取り出すなら matchAll を使うが、こちらは g フラグを付けないと実行時エラーになる。
文字列が正規表現に一致するか調べるには
RegExp.prototype.test は真偽値をそのまま返すため、一致の有無だけを見たいときはこれが最短である。ただし g フラグを付けた正規表現は lastIndex を保持し、同じインスタンスで test を繰り返すと途中から探し始めるので、判定用のパターンには g を付けない。
正規表現で置換するには
String.prototype.replace は既定で最初の 1 件しか置換しない。すべて置き換えるには g 付きの正規表現を渡すか replaceAll を使う。置換文字列の中では $1 で後方参照でき、関数を渡した場合は一致文字列が引数として渡ってくる。
2つの日付の差を求めるには
Date 同士を引くと数値に変換され、差はミリ秒で返る。日数にするには 86400000 で割る。専用の期間型が無いぶん単位を自分で決められるが、割った結果は小数のままなので、日数として使うなら Math.floor などで丸める向きを明示する。
文字列が含まれるか調べるには
String.prototype.includes が基本形で、真偽値をそのまま得られる。引数に正規表現を渡すと TypeError になるため、パターンで探したいときは includes ではなく test や match を使う。古い実行環境に合わせる必要があるときだけ indexOf(...) !== -1 を使う。
配列から重複を除くには
Set は挿入順を保つので、スプレッドで配列に戻すだけで出現順のまま重複が消える。オブジェクトは参照で比較され中身が同じでも別物と扱われるため、id などのキーで判定したいときは Map に詰め直す。この書き方では同じキーが後勝ちになる点に注意する。
配列を文字列に連結するには
Array.prototype.join は要素を暗黙に文字列化するので、数値の配列でもそのまま渡せる。ただし null と undefined は空文字に変換されるため、欠損を残したくないときは事前に filter で除く。
配列を条件で絞り込むには
Array.prototype.filter は条件が真になった要素だけを集めた新しい配列を返し、元の配列は変更しない。1 件だけ欲しい場面で filter を使うと不要な走査が残るので、その場合は find を選ぶ。
ディレクトリ内のファイル一覧を取得するには
readdir は既定で名前の配列を返すが、withFileTypes を付けると Dirent が返り、追加の stat 呼び出しなしでファイルとディレクトリを区別できる。項目数が多いディレクトリでは往復が減るぶん速い。
ネストしたJSONから値を取り出すには
オプショナルチェーン ?. は途中が undefined や null になった時点で評価を打ち切り、undefined を返す。既定値は ?? で与える。|| だと 0 や空文字まで既定値に置き換わってしまうため、数値や文字列を読むときは ?? を使う。
HTTPリクエストにヘッダーを付けるには
fetch の第 2 引数にある headers へオブジェクトを渡す形が最も短い。ハイフンを含むヘッダー名はそのままだと識別子にならないため、X-GitHub-Api-Version のようなキーは引用符で囲む。
環境変数を設定するには
process.env への代入は値を文字列へ変換するので、数値を入れても取り出すときは文字列になる。削除は delete process.env.API_TOKEN で行う。child_process のオプション env を省略すると親の環境がそのまま渡るため、一部だけ変えたいときはスプレッドで展開して上書きする。
.env ファイルを読み込むには
Node.js は 20.6.0 で --env-file フラグ、20.10.0 で process.loadEnvFile() を取り込んだため、新しめの環境では dotenv パッケージなしで読める。どちらも 20.x LTS へバックポートされている点に注意する。古い Node を対象にするなら require("dotenv").config() を使う。いずれの方法でも、読み込みは環境変数を参照する側より先に実行する必要がある。
日付文字列を日付型にするには
new Date が仕様として保証するのは ISO 8601 の書式だけで、それ以外の解釈は実装に委ねられている。同じ ISO でも日付だけの "2026-08-14" は UTC、時刻まで書いてオフセットを省いた場合はローカル時刻として読まれるため、日付だけ扱いたいときは基準の違いで 1 日ずれることがある。読めなかったときは例外ではなく Invalid Date が返るので、getTime() が NaN かどうかで判定する。
文字列の前後の空白を除去するには
String.prototype.trim は前後の空白文字を落とし、片側だけなら trimStart / trimEnd を使う。ここでいう空白文字には半角スペースやタブ・改行に加えて全角スペース（U+3000）も含まれるため、日本語の入力フォームでもそのまま使える。除去する文字を指定する引数は無いので、特定の文字を外したいときは replace を使う。
HTTP POSTでJSONを送るには
Node.js 18 以降のグローバル fetch で送れるので外部パッケージは要らない。body には JSON.stringify した文字列を渡し、Content-Type を明示する。res.ok を先に見るのは、fetch が 4xx / 5xx でも reject せず解決するため、確認しないとエラー応答を作成結果として読み進めてしまうからである。
オブジェクトをJSON文字列にするには
第 2 引数は出力するキーを絞る replacer、第 3 引数がインデント幅である。整形が不要なら JSON.stringify(user) だけでよい。undefined や関数を値に持つプロパティは黙って出力から落ちる点に注意する。