JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptのDate.setUTCHours()メソッドの使い方をわかりやすく解説

Dateオブジェクトは、JavaScriptに組み込まれているデータ型のひとつです。Dateオブジェクトは、new Date() を使って次のように生成します。

Dateオブジェクトを生成すると、多数のメソッドを使ってその値を操作できます。ほとんどのメソッドは、ローカル時間またはUTC（協定世界時／GMT）のいずれかを基準として、年・月・日・時・分・秒・ミリ秒の各フィールドを取得・設定するためのものです。

Dateオブジェクトの setUTCHours() メソッドは、時間を表す整数値を受け取り、協定世界時（UTC）に基づいて現在の日付（時刻）が持つ「時」の値を、引数で渡した値に置き換えます。

構文

setUTCHours() メソッドの構文は次のとおりです。

dateObj.setUTCHours(hoursValue, minutesValue, secondsValue, msValue);

パラメータ

  • hoursValue：「時」を表す 0〜23 の整数（必須）
  • minutesValue：「分」を表す 0〜59 の整数（省略可）
  • secondsValue：「秒」を表す 0〜59 の整数（省略可）
  • msValue：ミリ秒を表す 0〜999 の整数（省略可）

範囲外の値を指定した場合は、日付の他のフィールド（分・秒など）へ自動的に繰り越して処理されます。また、このメソッドは、更新後の日時が1970年1月1日0時0分0秒（UTC）から何ミリ秒経過しているかを示す数値を返します。

使用例1：既存の日付の「時」を変更する

<html>
<head>
  <title>JavaScript Example</title>
</head>
<body>
  <script type="text/javascript">
    var dateObj = new Date('september 26, 89 12:4:25:96');
    document.write("現在の日付：" + dateObj.toUTCString());
    document.write("<br>");
    dateObj.setUTCHours(23);
    document.write("時間設定後の日付：" + dateObj.toUTCString());
  </script>
</body>
</html>

実行結果

現在の日付：Tue, 26 Sep 1989 06:34:25 GMT
時間設定後の日付：Tue, 26 Sep 1989 23:34:25 GMT

この例では、setUTCHours(23) を呼び出すことで、UTC上の「時」が6から23に変更され、分・秒などの他の値はそのまま維持されていることがわかります。

使用例2：時刻を指定せずに生成した日付に時間を設定する

日付オブジェクトの生成時に時刻を指定しなかった場合でも、setUTCHours() メソッドを使えば、協定世界時に基づいて「時」を設定できます。

<html>
<head>
  <title>JavaScript Example</title>
</head>
<body>
  <script type="text/javascript">
    var dateObj = new Date('September 26, 1989');
    dateObj.setUTCHours(5);
    document.write(dateObj.toString());
  </script>
</body>
</html>

実行結果

Tue Sep 26 1989 10:30:00 GMT+0530 (India Standard Time)

UTCで午前5時に設定すると、インド（GMT+0530）や日本（GMT+0900）など、UTCより進んだタイムゾーンでは、時差が加算されたローカル時刻が表示されます。

使用例3：現在日時に対して時間を設定する

同様に、コンストラクタに何も値を渡さずに日付オブジェクトを生成した場合でも、このメソッドを使って協定世界時に基づく「時」を設定できます。このとき、月・日・年などの他の値は現在の日付（時刻）のまま維持されます。

<html>
<head>
  <title>JavaScript Example</title>
</head>
<body>
  <script type="text/javascript">
    var dateObj = new Date();
    dateObj.setUTCHours(5);
    document.write(dateObj.toString());
  </script>
</body>
</html>

実行結果

Thu Oct 18 2018 10:30:00 GMT+0530 (India Standard Time)

まとめ

  • setUTCHours() は、UTC（協定世界時）を基準にDateオブジェクトの「時」を設定するメソッドである
  • 第2引数以降を指定すれば、分・秒・ミリ秒も同時に設定できる
  • ローカル時間を基準に設定したい場合は、代わりに setHours() を使用する
  1. JavaScriptのDate.setUTCMonth()メソッドとは？構文と使い方を実例付きで解説

    Dateオブジェクトは、JavaScriptに組み込まれているデータ型の一つです。Dateオブジェクトは、次のように new Date() を使って生成します。 Dateオブジェクトを生成すると、多数のメソッドを使ってそのオブジェクトを操作できます。ほとんどのメソッドは、ローカル時間またはUTC（協定世界時／GMT）のいずれかの時刻基準で、年・月・日・時・分・秒・ミリ秒の各フィールドを取得・設定するためのものです。 setUTCMonth()メソッドは、年の月を表す整数を受け取り、UTC（協定世界時）に基づいて現在の日付の「月」の値を置き換えます。月の値は0が1月を表し、以降は11が12月に

  2. JavaScriptのDate.@@toPrimitive()関数とは？日付オブジェクトをプリミティブ値に変換する方法

    JavaScriptのDate.@@toPrimitive()関数は、Dateオブジェクトをプリミティブ値に変換するために使用されます。このメソッドはSymbol.toPrimitiveプロパティを通じて呼び出され、引数に指定したヒント（hint）に応じて、文字列や数値など適切なプリミティブ値を返します。 ヒントの種類と戻り値 「default」：日付を表す文字列が返されます。 「number」：1970年1月1日00:00:00 UTCからの経過ミリ秒数（タイムスタンプ）が数値で返されます。 「string」：「default」と同様に、日付を表す文字列が返されます。 サンプルコード 以