JavaScript での Date オブジェクトへの時間の追加

Sahil Bhosale 2023年10月12日
  1. setHours() メソッドを使用して、JavaScript で Date オブジェクトに時間を追加する
  2. getHours() および setHours() メソッドを使用して JavaScript で現在の時間の値を更新する
JavaScript での Date オブジェクトへの時間の追加

JavaScript の Date オブジェクトは、システムの現在の週、日付、時刻 (タイムゾーン付き) を提供します。 Date オブジェクトのデフォルトのタイムゾーンは UTC ですが、日付と時刻またはそのコンポーネントを取得する基本的な方法はすべて、ローカル (システムの) タイムゾーンに基づいて機能します。

Date オブジェクトは、setHours()setMonth()getTime()getDay() などのさまざまなメソッドも提供します。これらを使用して、オブジェクトの値にアクセスしたり変更したりできます。 時間、時間、分、タイムゾーンなどのDateオブジェクト。 メソッドの完全なリストを表示するには、[Date](Date - JavaScript | MDN) オブジェクトのドキュメントにアクセスしてください。

これらのメソッドのいくつかを使用して、JavaScript で Date オブジェクトに時間を追加する方法を見てみましょう。

setHours() メソッドを使用して、JavaScript で Date オブジェクトに時間を追加する

Date オブジェクトの時間の値を更新するには、組み込みの setHours() メソッドを使用します。 このメソッドは、分と秒ではなく、時間の値のみを更新します。

例を挙げて、setHours() メソッドを使用して時間の値を更新する方法を見てみましょう。 まず、システムの現在の時刻を取得するには、new キーワードを使用して Date のオブジェクトを作成し、それを変数 currentDateTime 内に保存してから、その変数を出力する必要があります。

これにより、システムの現地時間が得られます。

コード スニペット - JavaScript:

var currentDateTime = new Date();

function addHours(hr) {
  currentDateTime.setHours(hr);
}

console.log(currentDateTime);
addHours(5);
console.log(currentDateTime);

出力:

Mon May 5 2022 00:28:11 GMT+0530 (India Standard Time)
Mon May 5 2022 05:28:11 GMT+0530 (India Standard Time)

時間の値を追加するには、addHours() という関数を作成します。この関数は、現在の時刻に追加する時間の値を表す整数値である単一のパラメーター hr を取ります。

この関数内で、現在のローカル日付と時刻を保持する変数 currentDateTime に対して setHours() メソッドを呼び出し、その中に hr を渡します。

これにより、addHours() 関数に渡す hr 引数が設定されます。 整数値 5addHours() 関数に渡します。

最後に、addHours 関数を呼び出す前後の時間を表示すると、上記の出力に示すように、値 5 が現在の時間に追加されていることがわかります。

このメソッドを使用すると、既存または現在の時間の値を新しい値に置き換えることができます。 しかし、新しい値で完全に置き換えるのではなく、現在の時間の値を更新したい場合はどうでしょう。

JavaScript 内の Date オブジェクトのいくつかの定義済みメソッドを使用して、現在の時間の値を更新する方法を見てみましょう。

getHours() および setHours() メソッドを使用して JavaScript で現在の時間の値を更新する

これまで、時間の値を新しい値に直接置き換えています。 しかし、現在の時間の値を更新したいだけで、置き換えたくない場合はどうすればよいでしょうか?

getHours()setHours() メソッドの両方を同時に使用する必要があります。

コード スニペット - JavaScript:

var currentDateTime = new Date();
console.log(currentDateTime);

currentDateTime.setHours(currentDateTime.getHours() + 5);
console.log(currentDateTime);

出力:

Mon May 5 2022 20:29:17 GMT+0530 (India Standard Time)
Tue May 6 2022 01:29:17 GMT+0530 (India Standard Time)

ここでも、最初に Date オブジェクトから返された現在の日付と時刻を変数 currentDateTime に格納する必要があります。 次に、setHours()getHours() 関数の両方を同時に使用します。

時間の値を設定したいので、currentDateTime 変数で setHours() メソッドを使用します。 このメソッド内の currentDateTime 変数で getHours() メソッドを呼び出します。

getHours() メソッドは現在の値を取得し、その値に 5 を加算し、setHours() メソッドはその値を currentDateTime 変数に設定します。

また、setHours() メソッドを使用する前後の時刻を出力すると、現在の時刻が 20 であることがわかります。 この値に 5 の値を追加すると、1 になります。

これは、1 日全体が 24 時間であり、205 を足すと 25 になるため、24 時間が経過すると、上記の出力に示すように 1 から始まります。

著者: Sahil Bhosale
Sahil Bhosale avatar Sahil Bhosale avatar

Sahil is a full-stack developer who loves to build software. He likes to share his knowledge by writing technical articles and helping clients by working with them as freelance software engineer and technical writer on Upwork.

LinkedIn

関連記事 - JavaScript Date