Dateオブジェクト
オブジェクト
- JavaScriptに用意されている組み込みオブジェクト
- Webページが表示された時点で利用できるオブジェクト
- 必要に応じてユーザーが自分で生成するオブジェクト
Dateオブジェクト
- 日付時刻をデーターとして管理する
- Dateコンストラクタを引数なしで実行すると、現在の日付時刻を管理する「Dateオブジェクト」が生成される
Dateオブジェクトのインスタンスを生成
now = new Date();
Dateオブジェクトを生成
- 「toString」メソッドは、オブジェクトの内容を文字列にして戻すメソッド
- 「String」オブジェクトの場合には、日付時刻を文字列（英字）にして戻します
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>オブジェクトを生成する</title> </head> <body> <script> var now; now = new Date(); document.write('<h1>' + now.toString() + '</h1>'); </script> </body> </html>
Fri Jan 11 2013 10:05:52 GMT+0900 (JST)
- GMT：Greenwich Mean Time（グリニッジ標準時）
- UTC：Coordinated Universal Time（協定世界時）-原子時計によって決定される
指定した日時のDateオブジェクトを生成
<!DOCTYPE html> <html lang='ja'> <head> <meta charset='UTF-8'> <title>オブジェクトを生成する</title> </head> <body> <script> var aDay; aDay = new Date(2013, 0, 11, 15, 55, 50); document.write('<h1>' + aDay.toString() + '</h1>'); </script> </body> </html>
オブジェクト生成について
new演算子とコンストラクタ
変数 = new コンストラクタ（引数1, 引数2, ・・・）
toStringメソッド
- オブジェクトの内容を文字列にして戻す
- toStringメソッドは省略できる
document.write('<h1>', aDay, '</h1>');
日付時刻を文字列として指定してDateオブジェクトを生成する
- 「時：分：秒」を省略した場合は「0：0：0」とみなされます
- 2013年1月11日15時55分0秒
var theDay = new Date('January 11, 2013 15:55:00');
日付や時刻の操作
Dateオブジェクトのメソッド
- 日付を「xxxx年xx月xx日」の形式で表示する
<!DOCTYPE html> <html lang="ja"> <head> <meta charset='UTF-8'> <title>Dateオブジェクトのメソッドを使う</title> </head> <body> <script> var now, date; now = new Date(); date = now.getFullYear() + '年' + (now.getMonth() + 1) + '月' + now.getDate() + '日'; document.write('<h1>' + date + '</h1>'); </script> </body> </html>
getTimeメソッドで日数の差を求める
- 「ミリ秒」単位（1/1000秒）で戻す
- diff：difference
- 日数として使用するには「少数点以下の桁」が不要
- 「少数点以下を切り上げる」には、「Mathオブジェクトのceilメソッド」を利用します
diff = day2.getTime() - day1.getTime();
<!DOCTYPE html> <html lang="ja"> <head> <meta charset='UTF-8'> <title>Dateオブジェクトのメソッドを使う</title> </head> <body> <script> var now, date; now = new Date(); var gantan, days, diff; //来年の１月１日を表すDateオブジェクトを生成、今年の年を求め1を足して来年を設定、０は１月、１日 gantan = new Date(now.getFullYear() + 1, 0, 1); //来年の１月１日と現在時刻の時間差をミリ秒単位で求める diff = gantan.getTime() - now.getTime(); //秒を日数に換算し小数点以下を切り上げる days = Math.ceil(diff / (24 * 60 * 60 * 1000)); document.write('<h1>ことしの残り日数：' + days + '</h1>'); </script> </body> </html>
Dateオブジェクトの主なメソッド
| メソッド | 説明 |
|---|---|
| getFullYear | 年を4桁の数値で戻します |
| getMonth | 月を戻します。戻り値は「0」が1月、「1」が2月・・・ |
| getDay | 曜日を戻します。戻り値は「0」が日曜日、「1」が月曜日・・・ |
| getDate | 日を戻します |
| getHours | 時間を戻します。時間は24時間形式で、戻りの範囲は「0〜23」 |
| getMinutes | 分を戻します |
| getSeconds | 秒を戻します |
var date = now.getFullYear() + '年'
+ (now.getMonth() + 1) + '月' //戻り値に１を足す
+ now.getDay() + '日';
日時時刻の設定
- 「setFullYear」で年を設定
- 変数「aDay」に格納されているDateオブジェクトのインスタンスの日時を１年後に設定するには
aDate.setFullYear(aDay.getFullYear() + 1) ;
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>現在時刻を表示する</title> </head> <body> <script> var now, hour, minute; now = new Date(); hour = now.getHours(); minute = now.getMinutes(); document.write('<h1>'); document.write('現在時刻：'); document.write(hour, '時', minute, '分'); document.write('</h1>'); </script> </body> </html>
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>時間によってメッセージを変更する</title> </head> <body> <script> // 時間によってメッセージを変更する var today; var hour; today = new Date(); hour = today.getHours(); document.write('<h1>'); if (hour < 12) { document.write('おはようございます'); } else if (hour < 18) { document.write('こんにちは'); } else if (hour < 24) { document.write('こんばんは'); } document.write('</h1>'); </script> </body> </html>
