new Date()の使い方

2016.10.22

new Date()の使い方などをまとめてみます。

new Date()の指定方法

new Date()の引数の指定方法は大きく4種類あります。

JavaScript

new Date();
new Date(year, month[, day, hour, minutes, seconds, milliseconds]);
new Date(value);
new Date(dateString);

引数の指定がない場合、現在日時でDateオブジェクトを生成します。

引数が2つ以上の整数値で指定されている場合、第一引数から順番に年,月,日,時,分,秒,ミリ秒になります。
引数が指定されていない場合、日には1、それ以外には0が設定されます。
月だけ数値が0始まりになるので注意が必要です。

他に1970年1月1日(UTC)からのミリ秒の整数値で指定する方法、日付を表す文字列で指定する方法があります。
ただし、後者は指定内容によってブラウザごとの動作が異なる場合があるので、使用する場合は注意してください。

JavaScript

// 現在日時
var current = new Date();
console.log(current); // 現在日時が表示されます

// 年月指定
var date01 = new Date(2016, (12 - 1));
console.log(date01); // Thu Dec 01 2016 00:00:00 GMT+0900

// 年月日指定
var date02 = new Date(2016, (12 - 1), 24);
console.log(date02); // Sat Dec 24 2016 00:00:00 GMT+0900

// 年月日時指定
var date03 = new Date(2016, (12 - 1), 24, 20);
console.log(date03); // Sat Dec 24 2016 20:00:00 GMT+0900

// 年月日時分指定
var date04 = new Date(2016, (12 - 1), 24, 20, 30);
console.log(date04); // Sat Dec 24 2016 20:30:00 GMT+0900

// 年月日時分秒指定
var date05 = new Date(2016, (12 - 1), 24, 20, 30, 5);
console.log(date05); // Sat Dec 24 2016 20:30:05 GMT+0900

// 年月日時分秒ミリ秒指定
var date06 = new Date(2016, (12 - 1), 24, 20, 30, 5, 300);
console.log(date06); // Sat Dec 24 2016 20:30:05 GMT+0900

// 1970年1月1日(UTC)からのミリ秒で指定
var date07 = new Date(1482579000000);
console.log(date07); // Sat Dec 24 2016 20:30:00 GMT+0900

// 日付を表す文字列で指定
var date08 = new Date('2016-12-24');
console.log(date08); // Sat Dec 24 2016 09:00:00 GMT+0900

// 日付を表す文字列で指定2
var date09 = new Date('2016/12/24');
console.log(date09); // Sat Dec 24 2016 00:00:00 GMT+0900

new Date()の指定方法のデモページ
　

日付や時間の取得

Dateオブジェクトから日付や時間を取得してみます。

JavaScript

// 日時の指定
var date = new Date(2016, (12 - 1), 24, 20, 30, 5, 300);
console.log(date); // Sat Dec 24 2016 20:30:05 GMT+0900

// 年の取得(4桁)
var getFullYear = date.getFullYear();
console.log(getFullYear); // 2016

// 月の取得(0-11)
var getMonth = date.getMonth();
console.log(getMonth); // 11

// 日の取得(1-31)
var getDate = date.getDate();
console.log(getDate); // 24

// 曜日の取得(0-6)
var getDay = date.getDay();
console.log(getDay); // 6

// 時の取得(0-23)
var getHours = date.getHours();
console.log(getHours); // 20

// 分の取得(0-59)
var getMinutes = date.getMinutes();
console.log(getMinutes); // 30

// 秒の取得(0-59)
var getSeconds = date.getSeconds();
console.log(getSeconds); // 5

// ミリ秒の取得(0-999)
var getMilliseconds = date.getMilliseconds();
console.log(getMilliseconds); // 300

// 1970年1月1日(UTC)からの数値の取得(ミリ秒)
var getTime = date.getTime();
console.log(getTime); // 1482579005300

// UTCからの時差の取得(分)
var getTimezoneOffset = date.getTimezoneOffset();
console.log(getTimezoneOffset); // -540

日付や時間の取得のデモページ
　

日付や時間の設定

Dateオブジェクトに日付や時間を設定してみます。

JavaScript

// 日時の指定
var date = new Date(2016, (12 - 1), 24, 20, 30, 5, 300);
console.log(date); // Sat Dec 24 2016 20:30:05 GMT+0900

// 年の設定
date.setFullYear(2017);
console.log(date); // Sun Dec 24 2017 20:30:05 GMT+0900

// 月の設定
date.setMonth((2 - 1));
console.log(date); // Fri Feb 24 2017 20:30:05 GMT+0900

// 日の設定
date.setDate(14);
console.log(date); // Tue Feb 14 2017 20:30:05 GMT+0900

// 時の設定
date.setHours(16);
console.log(date); // Tue Feb 14 2017 16:30:05 GMT+0900

// 分の設定
date.setMinutes(0);
console.log(date); // Tue Feb 14 2017 16:00:05 GMT+0900

// 秒の設定
date.setSeconds(10);
console.log(date); // Tue Feb 14 2017 16:00:10 GMT+0900

// ミリ秒の設定
date.setMilliseconds(500);
console.log(date); // Tue Feb 14 2017 16:00:10 GMT+0900

// 1970年1月1日(UTC)からのミリ秒での数値で設定
date.setTime(1489446620800);
console.log(date); // Tue Mar 14 2017 08:10:20 GMT+0900

日付や時間の設定のデモページ
　

曜日の取得

getDay()で曜日を取得すると、0-6の数値で返ってきます。
順番に0が日曜で6が土曜なので、曜日の配列を用意して変換するようにします。

JavaScript

// 曜日の準備
var weekday = ['日', '月', '火', '水', '木', '金', '土'];

// 日時の指定
var date = new Date(2016, (12 - 1), 24);

console.log(date.getDay()); // 6
console.log(weekday[date.getDay()]); // 土

曜日の取得のデモページ
　

指定した月の最後の日を取得

月の最後の日を取得したい場合、日に0を指定します。
その際、月が0開始ではないので注意してください。

JavaScript

// 日時の指定(月が0開始ではないので注意)
var date = new Date(2016, 2, 0);
console.log(date); // Mon Feb 29 2016 00:00:00 GMT+0900
console.log(date.getDate()); // 29

指定した月の最後の日を取得のデモページ
　

日付の差

getTime()を使って二つの日付の差をミリ秒単位で取得した後に、分単位や日単位に変換してみます。

JavaScript

// 日時の指定
var date1 = new Date(2017, (2 - 1), 24, 20, 0);
var date2 = new Date(2017, (3 - 1), 25, 8, 0);

// 差(ミリ秒単位)
var df = date2.getTime() - date1.getTime();
console.log(df); // 2462400000

// 差(秒単位)
console.log(df / 1000); // 2462400

// 差(分単位)
console.log(df / 1000 / 60); // 41040

// 差(時単位)
console.log(df / 1000 / 60 / 60); // 684

// 差(日単位)
console.log(df / 1000 / 60 / 60 / 24); // 28.5

date1にページアクセス時の日時、date2に現在の日時を取得することで、ページアクセス時からの経過時間を調べたりもできます。
日付の差のデモページ
　

日付や時間の加算・減算

Dateオブジェクトの日付や時間を個別に加算・減算してみます。

JavaScript

// 日時の指定
var date = new Date(2016, (12 - 1), 24, 20, 30, 40, 500);
console.log(date); // Sat Dec 24 2016 20:38:20 GMT+0900

// 1年後
date.setFullYear(date.getFullYear() + 1);
console.log(date); // Sun Dec 24 2017 20:30:40 GMT+0900

// 2ヶ月後
date.setMonth(date.getMonth() + 2);
console.log(date); // Sat Feb 24 2018 20:30:40 GMT+0900

// 14日後
date.setDate(date.getDate() + 14);
console.log(date); // Sat Mar 10 2018 20:30:40 GMT+0900

// 10時間後
date.setHours(date.getHours() + 10);
console.log(date); // Sun Mar 11 2018 06:30:40 GMT+0900

// 45分後
date.setMinutes(date.getMinutes() + 45);
console.log(date); // Sun Mar 11 2018 07:15:40 GMT+0900

// 90秒後
date.setSeconds(date.getSeconds() + 90);
console.log(date); // Sun Mar 11 2018 07:17:10 GMT+0900

// 2500ミリ秒後
date.setMilliseconds(date.getMilliseconds() + 2500);
console.log(date); // Sun Mar 11 2018 07:17:13 GMT+0900

// 2年前
date.setFullYear(date.getFullYear() - 2);
console.log(date); // Fri Mar 11 2016 07:17:13 GMT+0900

// 4ヶ月前
date.setMonth(date.getMonth() - 4);
console.log(date); // Wed Nov 11 2015 07:17:13 GMT+0900

// 45日前
date.setDate(date.getDate() - 45);
console.log(date); // Sun Sep 27 2015 07:17:13 GMT+0900

// 30時間前
date.setHours(date.getHours() - 30);
console.log(date); // Sat Sep 26 2015 01:17:13 GMT+0900

// 200分前
date.setMinutes(date.getMinutes() - 200);
console.log(date); // Fri Sep 25 2015 21:57:13 GMT+0900

// 500秒前
date.setSeconds(date.getSeconds() - 500);
console.log(date); // Fri Sep 25 2015 21:48:53 GMT+0900

// 2500ミリ秒前
date.setMilliseconds(date.getMilliseconds() - 2500);
console.log(date); // Fri Sep 25 2015 21:48:50 GMT+0900

現在の値を取得して、加算・減算を行った後に設定しています。
日付や時間を加算・減算するデモページ
　

【参考サイト】

　

このエントリーをはてなブックマークに追加

関連記事

コメントを残す

メールアドレスが公開されることはありません。
* が付いている欄は必須項目です

CAPTCHA


コメントが承認されるまで時間がかかります。

Category

Tag

Recent

2024年4月
日 月 火 水 木 金 土
 123456
78910111213
14151617181920
21222324252627
282930