なぜsetHoursが必要なのか?
JavaScriptでWebサイトを作成していると、「昨日の23時59分に処理を終了したい」「来週の朝9時に通知を出したい」といった、特定の日時の時間を変更したい場面によく遭遇します。しかし、JavaScriptのDateオブジェクトは直接値を変更するメソッドが少なく、扱いが難しいと感じる方も多いでしょう。そこで活躍するのがsetHoursメソッドです。これを使えば、日付オブジェクトが持つ「時間」の部分をピンポイントで書き換えることができます。
基礎知識:Dateオブジェクトと時間の概念
JavaScriptのDateオブジェクトは、内部的に「1970年1月1日からの経過ミリ秒」という形式で日時を管理しています。setHoursメソッドは、その管理されている時刻のうち、「時・分・秒・ミリ秒」を自由に変更できる便利なツールです。
このメソッドを使う際のポイントは、「元のDateオブジェクト自体が書き換わる(破壊的変更)」という点です。新しい日付を作りたい場合は、一度コピーを取ってから操作するのが現場での定石となります。
実装方法:setHoursの書き方
setHoursは、引数に最大4つの数値を渡すことができます。
・第1引数:時間(0~23)
・第2引数:分(0~59)
・第3引数:秒(0~59)
・第4引数:ミリ秒(0~999)
これらを指定することで、一気に時刻を調整可能です。例えば「15時30分」にしたい場合は、setHours(15, 30)と記述するだけで完了します。
サンプルプログラム
以下のコードをブラウザのコンソールや、JavaScript環境で実行してみてください。
// 現在の日時を取得
const today = new Date();
// 日付オブジェクトをコピー(元のtodayを変更しないための工夫)
const deadline = new Date(today.getTime());
// 18時0分0秒に設定する
deadline.setHours(18, 0, 0, 0);
console.log("現在時刻:", today.toLocaleString());
console.log("設定後の時刻:", deadline.toLocaleString());
// 応用:明日の朝9時に設定する例
const tomorrowMorning = new Date();
tomorrowMorning.setDate(tomorrowMorning.getDate() + 1); // 1日進める
tomorrowMorning.setHours(9, 0, 0, 0); // 9時にセット
console.log("明日の朝9時:", tomorrowMorning.toLocaleString());
応用・注意点:現場での落とし穴
実務でsetHoursを使う際に注意すべき点が2つあります。
1. 範囲外の数値を入れるとどうなる?
setHoursは優秀で、例えば「25時」と入力すると、自動的に「翌日の1時」へと繰り上がります。この挙動は非常に便利ですが、意図せず日付が変わってしまう原因にもなるため、入力値のバリデーション(チェック)には注意してください。
2. 破壊的変更の罠
前述の通り、setHoursは実行した変数の値を直接書き換えます。もし関数内で「引数として受け取った日付」にsetHoursを適用すると、呼び出し元の変数まで書き換わってしまい、思わぬバグを生むことがあります。必ず新しいインスタンス(new Date())を作成してから操作する習慣をつけましょう。
これらを意識するだけで、JavaScriptでの日時操作は格段に安全で分かりやすくなります。ぜひ試してみてください!