JavaScript講座 Dateオブジェクト/メールマガジン第98号今週のおさらい

初心者のためのホームページ作り

メールマガジン「初心者のためのホームページ作り」でお伝えした内容を、「復習」の意味で掲載しています。テキストのみのマガジンと違って、実際のサンプルや画像を交えて解説していますので、理解が深まると思います。

なお文中、疑問点や分からない点がありましたら、ご遠慮なく当方までメールにてご質問ください。

＜第98号＞ 今週のおさらい
　　　　　　　　　　　　　毎週金曜日配信　What's New 2004年7月30日
□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□
　  ■ JavaScript講座 (第19回) --- Dateオブジェクト
　　■ JavaScript講座 (第20回)  --- 制御構文

◆ JavaScript講座 --- Dateオブジェクト

JavaScriptで、日付や時間などを扱うのが Dateオブジェクトです。このオブジェクトはメソッドしか存在しませんが、日付や時間、曜日などをコントロールする場合に用いられる非常にポピュラーなオブジェクトです。

Dateオブジェクトを利用するためには、newステートメントという制御文を使って日付オブジェクトを生成します。その上であらかじめ定義されている各メソッドを使って日付や時間を参照したり計算したりします。

例えば、

today = new Date();
  y = today.getFullYear();
　m = today.getMonth() + 1;
　d = today.getDate(); //　todayより日数を求める
　　　document.write("現在は", y, "年", m, "月", d, "日です");

のように、現在の日付を求める場合でも必ず new文を用いて日付オブジェクトを生成する必要があります。

上記スクリプトの実行結果はこちら　(あわせて toLocaleStringメソッドも追加しました。)

Dateオブジェクトで定義されているメソッドは以下のとおりです。

**Dateオブジェクトのメソッド一覧**
メソッド	機能
getDate	現在の日にちを参照 (0 ～ 30)
getDay	曜日を参照する (0～6、日曜～土曜)
getFullYear	４桁の西暦年を参照する
getHours	現在の時間を参照する
getMilliseconds	ミリ秒（1000=1秒）を参照する
getMinutes	分を参照する
getMonth	月を参照する（0～11、1月～12月）
getSeconds	秒を参照する
getTime	1970年1月1日午前0時からの経過時間（秒数）を参照する
getTimezoneOffset	世界協定時間との時差を参照する
getUTCDate	世界協定時間の日にちを参照する
getUTCDay	世界協定時間の曜日を参照する（0～6、日曜～土曜）
getUTCFullYear	世界協定時間の４桁の西暦年を参照する
getUTCHours	世界協定時間の現在の時間を参照する
getUTCMilliseconds	世界協定時間のミリ秒（1000=1秒）を参照する
getUTCMinutes	世界協定時間の分を参照する
getUTCMonth	世界協定時間の月を参照する（0～11、1月～12月）
getUTCSeconds	世界協定時間の秒を参照する
getYear	年（西暦の下２桁）を参照する
parse	1970年1月1日午前0時から指定した日付までの経過秒数を参照
setDate	日にちを設定する
setFullYear	４桁の西暦年を設定する
setHours	現在の時間を設定する
setMilliseconds	ミリ秒（1000=1秒）を設定する
setMinutes	分を設定する
setMonth	月を設定する（0～11、1月～12月）
setSeconds	秒を設定する
setTime	1970年1月1日午前0時からの経過時間（秒数）を設定する
setUTCDate	世界協定時間の日にちを設定する
setUTCFullYear	世界協定時間の４桁の西暦年を設定する
setUTCHours	世界協定時間の現在の時間を設定する
setUTCMilliseconds	世界協定時間のミリ秒（1000=1秒）を設定する
setUTCMinutes	世界協定時間の分を設定する
setUTCMonth	世界協定時間の月を設定する（0～11、1月～12月）
setUTCSeconds	世界協定時間の秒を設定する
setYear	年（西暦の下２桁）を設定する
toGMTString	グリニッジ（GMT）標準時間を文字列として参照する
toLocalString	ローカル（地域別）時間を文字列として参照する
toUTCString	世界協定（UTC）時間を文字列として参照する
UTC	1970年1月1日午前0時から指定した日付までの経過秒数を参照

■ 時間の計算

時間を計算する場合、時間の最小単位は「ミリ秒」なので、秒や分、時、日などの換算する必要があります。1000ミリ秒は 1秒になりますので、１分はその60倍となります。それを踏まえてスクリプトを作成します。

以下は、来年の正月までの日数を求めるもので、差分から得られた値を日数に変換しています。

y = 2005; m = 1; d = 1;
　shogatsu = new Date(y,m,d);

　today = new Date();
　a = (shogatsu.getTime() - today.getTime());
　 remain = Math.floor(a / (24 * 60 * 60 * 1000));
　document.write("お正月まであと ", remain, "日です");

サンプルスクリプトの実行結果

◆ JavaScript講座 --- 制御構文

JavaScriptはオブジェクト指向言語といわれています。スクリプトを形成する上でオブジェクトは必要不可欠であるところから、あるいはもともとの言語仕様がオブジェクトで形成されているところからそのように呼ばれています。

しかしながら、オブジェクトを制御するためには欠かせない命令文があります。それがあらかじめ定義されている制御命令文です。これによって、様々なシーンでオブジェクトをコントロールします。

**`JavaScript`制御文一覧**
制御文	機能
break	制御構文 (ループなど) から抜け出す
case	条件 (switch文) によって振り分けられた値を指定する
continue	制御構文の先頭に戻る
default	switch文の条件に当てはまらない値を指定する
do	１度の処理後に条件を満たすまで繰り返し処理を行う
delete	指定した変数の値やオブジェクトを消去する
else	if構文の条件とは異なる条件を指定する
for	指定した条件に基づいて繰り返し処理を行う
function	任意の関数を生成する
if	条件分岐を論理式により設定する
in	同じオブジェクトのプロパティを利用する (for構文で使う)
new	任意のオブジェクトを生成する
return	関数から抜け出る際の戻り値を指定する
switch	ある条件から得た値によって処理を指定する
this	現在のオブジェクトを指定する
prototype	オブジェクトに任意の属性を指定する
while	条件を満たすまで繰り返し処理を行う
with	対象となるオブジェクトを指定する
var	変数の定義宣言

■ 繰り返し制御 (ループ)

制御文の中で、for、及び while文は、ある一定の処理を繰り返し行うときに利用します。それぞれは似ていますが、条件付けが異なります。

以下は for構文のサンプルです。

a = 0;
　for(a = 1; a < 101; a++) {
　document.write("JavaScript講座 第", a, "回目<br>");
  }

for構文の実行結果

サンプルの実行結果を見てお分かりのとおり、for文の論理式で指定された条件が満たされるまで同じ処理を繰り返します。このサンプルでは 100回も同じ処理が繰り返し指定し実行します。

一方、while文では、論理式は条件のみを指定し、条件が満たされるまで繰り返し処理を行います。このとき、あらかじめ条件が満たされていた場合にはループには入りません。これが for文との相違となります。

以下は、while構文のサンプルです。

while (a < = 10) {
  a++;
  document.write("JavaScript講座 第", a, "回目"); 
  }

while構文の実行結果

■ 条件分岐

あらゆる開発プログラム言語のすべてで条件分岐という手法が使われます。ユーザからの入力によって、処理プログラムを選択することができる条件分岐は、if、あるいは switch などの制御文で行います。

for構文は、その引数に論理式 (初期値、条件式、増減式) を設定し、条件が満たされたときに (あるいは満たされない場合) 、処理を行います。(あるいは処理を行わない)

以下は、for構文の具体的なサンプルです。

today = new Date();
  nowDate = today.getHours();
　if(nowDate > 4) && (nowDate <= 11)
　document.write("おはようございます");
     else if(nowDate > 11) && (nowDate <= 18)
　　 document.write("こんにちは");
        else if(nowDate > 18) && (nowDate <= 23)
　 　　 document.write("こんばんは");
          else
          document.write("もう寝ましょう"");

実行結果

　　(時間によってメッセージの内容が異なります)

switch文では、あらかじめ幾つかの処理を設定し、求められた値によって処理内容を振り分けるという条件分岐です。同じ条件分岐でも if構文とはちょっと異なるプログラムとなります。

特に、処理を行って構文から抜ける場合には break文が必要になり、条件となる値は case文に続いて示します。以下はその具体的なサンプルです。

today = new Date();
switch(today.getDay()){

case 0:
　document.write("本日は休み、日曜日です");
　break;

case 6:
　document.write("本日は休みかな？ 土曜日です");
　break;

default:
　document.write("本日は平日です、さて何曜日？");
　}

実行結果

　　(曜日によってメッセージの内容が異なります)

■ まとめ/dt>

制御文は、直接オブジェクトをコントロールする命令文になります。JavaScriptを学ぶ上で、オブジェクトと共に、制御文をよく理解して覚えておきましょう。

初版公開日 2004年7月30日

初心者のためのホームページ作り 第98号

初心者のためのホームページ作り　第98号