【JavaScript】特定の時間帯だけ処理を実行する方法｜業務アプリや予約制サイト向け実装例

JavaScriptを使って「特定の時間帯だけ処理を実行したい」というニーズは、業務用Webアプリや予約サイト、チャットサポートの受付など、さまざまな場面で発生します。この記事では、現在時刻を判定し、指定した時間内にだけ関数を実行する方法と、その実用例を紹介します。

時間帯を指定して処理を実行する基本構文
時分単位での制御も可能
業務アプリへの実装例｜平日のみサポート受付を表示する
応用例｜予約フォームの受付時間を制限する
まとめ

時間帯を指定して処理を実行する基本構文

まずは、特定の時間帯だけ処理を動かす基本的なJavaScriptのコードを紹介します。以下は、午前9時から午後5時の間だけ処理を実行するサンプルです。

function isBusinessHours() {
  const now = new Date();
  const hours = now.getHours();

  // 9時〜17時（17時未満）に限定
  return hours >= 9 && hours < 17;
}

if (isBusinessHours()) {
  console.log('業務時間中の処理を実行します');
  // 実行したい処理をここに記述
} else {
  console.log('営業時間外です');
}

このコードでは、Dateオブジェクトから現在の時間（0〜23の整数）を取得し、指定範囲かどうかを判定しています。

時分単位での制御も可能

さらに精度を高めて、時刻だけでなく分まで判定したい場合は、以下のように記述します。

function isWithinTimeRange(startTime, endTime) {
  const now = new Date();
  const current = now.getHours() * 60 + now.getMinutes(); // 現在時刻を分に変換

  const [startH, startM] = startTime.split(':').map(Number);
  const [endH, endM] = endTime.split(':').map(Number);
  const start = startH * 60 + startM;
  const end = endH * 60 + endM;

  return current >= start && current < end;
}

// 例：09:30〜17:45の間のみ処理
if (isWithinTimeRange('09:30', '17:45')) {
  console.log('指定時間内です。処理を実行します。');
} else {
  console.log('時間外です。');
}

このようにすることで、より柔軟な時間帯制御が可能になります。

業務アプリへの実装例｜平日のみサポート受付を表示する

たとえば「平日の9時〜18時のみ、チャットサポートのボタンを表示する」といったケースでは、曜日も考慮する必要があります。

function isWeekdayBusinessHours() {
  const now = new Date();
  const day = now.getDay(); // 0:日曜, 1〜5:平日, 6:土曜
  const hour = now.getHours();

  return day >= 1 && day <= 5 && hour >= 9 && hour < 18;
}

if (isWeekdayBusinessHours()) {
  document.querySelector('#chat-support').style.display = 'block';
} else {
  document.querySelector('#chat-support').style.display = 'none';
}

このコードでは、チャットサポートのHTML要素（#chat-support）の表示・非表示を切り替えています。

応用例｜予約フォームの受付時間を制限する

以下は、午前10時〜午後4時以外は予約フォームを送信不可にする例です。

document.querySelector('#submit-btn').addEventListener('click', function (e) {
  if (!isWithinTimeRange('10:00', '16:00')) {
    e.preventDefault();
    alert('受付時間外のため、予約できません。');
  }
});

このように、ボタンのクリック時に時刻をチェックすることで、ユーザーの誤送信を防ぐことができます。