第6章 JavaScript 日時の処理

こんにちは!

いよいよ時間や日時の処理ですwww

これが結構面倒なのですが・・・・・・・・・

まずはプログラムから

画像1

画像2

 

日付オブジェクトを作成する①
new Date(日付や時刻)
指定した日付や時刻をもとに日付オブジェクトを作成

()内は日付や時刻を指定

日付オブジェクトを作成する②
new Date()
アクセス日時をもとに日付オブジェクトを作成

()内は何も記述しないようにします。

先ほどのプログラムを細かく見ていきます。

kyou=new Date("2020/5/21");

hiduke=new Date();

変数 kyou を宣言し new Date("2020/5/21"); を代入します。

変数 hiduke を宣言 new Date();の()に日付や時刻の指定がなければアクセス日時をもとに日付オブジェクトが作成される。

__________________________________

document.write("今日は",kyou,"です。");

document.write("<br>");

document.write("今日は",hiduke,"だ!");

()内をWebページに書き出すプログラムです。

__________________________________

説明はここまでで、

実際に表示するとこんな感じになります。

画像3


下のほうに日付と時間が出ております。

次に最終更新日時を表示するというプログラムを付け加えて終わりにします。

画像4

画像5

 


koushin=new Date(document.lastModified);
変数 koushin を宣言し new Date(document.lastModified);を代入

document.write(koushin,"update");
()内をWebページに書き出すプログラムです。

最終更新日時を返す
document.lastModified

HTMLファイルを最後に保存した日時を返すプログラムっす。

___________________________________

WWWサーバーによっては正しい日時が返されない場合がある。

画像6

 

画像7

プログラム補こんな感じ

kyou.getFullYear()
kyou.getMonth()+1
kyou.getDate()
それぞれ 年、月、日をかえすので

表示すると

画像8

こうなりますwww

西暦年を返す
日付オブジェクト.getFullYear()

指定した日付オブジェクトから西暦の年を返す。

月を返す
日付オブジェクト.getFullMonth()

指定した日付オブジェクトから月を0~11で返す

但し1月は0、2月は1…が返ってくるので

ブラウザで表示するときは+1をする必要があります。

日にちを返す
日付オブジェクト.getFullDate()

指定した日付オブジェクトから日にちを返す。

次はTIME(時間)です。

まずは、設定の仕方。

時間を返す
日付オブジェクト.getHours()

指定した日付オブジェクトから時間を返す。

分を返す
日付オブジェクト.getMinutes()

指定した日付オブジェクトから分を返す。

秒を返す
日付オブジェクト.getSeconds()

指定した日付オブジェクトから秒を返す。

画像9

今回追加した部分がこれ↑

表示すると…………‥

画像10

曜日の表示から・・・・・

その前に、

曜日を返す
日付オブジェクト.getDay()
指定した日付オブジェクトの曜日を 0~6で返します。

日曜日から順番に0123456と割り振られています。

※曜日の値を日本語で表示するには配列を表示します。


document.write(・・・・"日の",kyou.getDay(),"曜日")
今回はプログラムに一部を載せておきます

これを表示すると・・・

画像11


こんな感じになります。

次に日本語で表示するために配列を使って書き換えます。

先に配列の説明をしておこうと思います。

配列を宣言してデータを代入
____________________________________

書き方①
配列名=new Array();
配列名[0]=データ
配列名[1]=データ
配列名[2]=データ
    ・
    ・
配列名[X]=データ
____________________________________

書き方②
配列名=new Array(データ、データ、データ・・・・・);
____________________________________

※どちらの記述でも表示できます。

配列を宣言し配列にデータを代入します。

配列を使うとき最初に配列名を指定します。

で、これが今回記述したプログラムですが

wks=new Array();
wks[0]="日";
wks[1]="月";
wks[2]="火";
wks[3]="水";
wks[4]="木";
wks[5]="金";
wks[6]="土";


先ほどのところにもこう書き加えます

wks[kyou.getDay()],"曜日"
表示すると・・・

画像12

きちんと今日の曜日が表示されました。

日時をもとに計算するというプログラムを

とりあえず使い方

1970/1/100:00:00経過ミリ秒を返す

日付オブジェクト.getTime()
経過した時間を求めるときに使います。

document.write("今日は・・・・から数えて",Math.ceil*1/(1000*60*60*24)),"日後です");

大体こんな感じのプログラム

表示すると●日後と返ってくるはずですが今調査中・・・・

画像13

他の使い方を説明します。

小数点以下の切り上げ
Math.ceil(数値または数式)
()内の数値、数式の小数点以下を切り上げた整数を返します

小数点以下切り捨て
Math.floor(数値または数式)

()内の数値、数式の小数点以下を切り捨てた整数を返します

小数点以下四捨五入
Math.round(数値または数式)

()内の数値、数式の小数点以下を切り四捨五入した整数を返します

画像14

今回追加&修正したプログラム

これを表示すると、

画像15

ここまでご覧いただきありがとうございました。

BY  MT

______________________________

参考書は

よくわかる

ゼロからはじめるJavaScript

発行者  大森 康文

著作/制作 富士通エフオーエム株式会社

 

f:id:t2567cdcas:20200730084643j:plain

 

*1:hizuke.getTime()-now.getTime(