JavaScriptで日付を扱うときの注意点：UTCとローカル時刻の違い

はじめに

日付を扱うコードを書いていて、こんな違和感を覚えたことはありませんか？

「日付を取得しただけなのに、想定より1日ずれている」

私自身、React Nativeアプリの開発中にこの問題に直面しました。
原因は、UTC（協定世界時）とローカル時刻（日本時間など） の違いにあります。

この記事では、new Date()とdayjs()で日付を取得する際に発生する、
タイムゾーンの違いによって日付がずれる問題について解説します。

※TypeScriptでも本質的には同じ問題が発生します。

JavaScript標準の new Date() はUTC基準

例えば、今日の日付を取得するために以下のようなコードを書いたとします。

const today = new Date().toISOString().split('T')[0];
console.log(today);

このコードは、一見問題なさそうに見えますが、
実はUTC基準で動作しています。

そのため、日本時間（JST: UTC+9時間）では、
深夜や早朝に実行すると「前日の日付」になることがあります。

実際に起こりうる例

以下のケースを考えてみましょう。

• 4月26日 0:30（日本時間）に実行
• → UTCではまだ4月25日
• → today は 2025-04-25 になる

ログの出力結果：

2025-04-25

dayjs()はローカルタイム基準（注意点あり）

次に、dayjsライブラリを使って日付を取得してみます。

import dayjs from 'dayjs';

const today = dayjs().format('YYYY-MM-DD');
console.log(today);

この場合、基本的に実行環境のローカルタイム（例：日本ならJST）が使われます。
そのため、通常は意図した「今日の日付」が取得できます。

ログの出力結果：

2025-04-26

ただし注意点として、実行するサーバーや端末の設定によっては、UTCのまま動作することもあります。
そのため、「環境によって挙動が異なる」 という点は覚えておくと安心です。

どちらを使うべきか？

結論としては、プロジェクトや運用方針に合わせて使い分けることが重要です。

	UTC基準で取得	ローカル基準で取得
new Date().toISOString()	✅	❌
dayjs().format()	❌（基本ローカル）	✅

実装時に気をつけたいポイント

• サーバーとクライアントで時刻設定が異なると、バグが発生しやすい
• 国際展開（複数タイムゾーン対応）を視野に入れる場合は、UTC管理が一般的である
• 日本国内向けサービスなら、ローカルタイム管理で問題ない場合が多い

おわりに

日付は一見シンプルに見えますが、
タイムゾーンの違いに注意を払わないとバグの温床になります。

同じ問題に直面している方々の一助になれば幸いです。