50代からのHTML / CSS / JavaScriptチャレンジ No.133 日付の表示

今日は日付を表示するプログラムについて学習します。では早速始めていきます。Dateオブジェクトというのを使うそうです。

そしたら、これまで、通り、新規ファイルを作成して、template.htmlより基本のhtmlをコピペする。新規ファイルの名前はdate.htmlとする。

そしたら、bodyタグ内に、javascriptを書く準備をする。作るのは、今日の日付を画面に表示するプログラムになります。
まずは、JavaScriptで今日の日付を知る必要がある。次のように記述する。

定数を宣言するんだね〜予想と違った（笑）ちなみにこの１文、const today = new Date();の部分で今日の日付を知ることができたらしい。

そしたら、document.writeでtodayを入れればいいのかなと思ったんだけど、ちょっと違った＾＾；

today.getFullYear()って書くのか＾＾；
そしたら、一旦、保存して、ブラウザーで確認。

今この学習をしてるのが2025年なので、ブラウザーにも2025と表示されてる。
で、この、getFullYear()というメソッドなんだけど、FullYearっていうのは４桁のことらしい。２桁だとただのYearになるんだって。４桁で年を取得しますよっていうメソッドになるらしい。

で、ここちょっとややこしいんだけど、document.writeのwriteはメソッドで、documentオブジェクトが対象となってますよ、ってことなんだよね。で、getFullYear()はメソッドなんだけど、これのオブジェクトがtodayになる。それを丸ごと引数に入れたんだね。

さらに、このtodayはどこから来てるのかっていうと、定数で宣言したconst todayのところ。このtodayがオブジェクトになっている。ただ、これ、todayオブジェクトじゃないんだよね＾＾；Dateオブジェクトというものらしい。そっか、変数で代入してるからか。なので、DateオブジェクトのgetFullYear()メソッドを使いましたってことになるのか。

ただし、document.writeみたいに直接使えるものもあるんだけど、Dateオブジェクトの場合は、直接は使えないらしい＾＾；つまり、Date.getFullYear()とは書けないんだって。

なので、Dateオブジェクトというものを使うときは、準備として、new Date()と書いたものを、代入しないとダメらしい。この時、todayは、Dateメソッドを実体化したインスタンスって言うらしい・・・だんだんこんがらがってきたぞ＾＾；つまり、インスタンス化されたってわけね。

まとめると、Dateメソッドをインスタンス化した、todayというものを使って、getFullYear()メソッドを使うってこと。これで、今日の日付の「年」を取得することができるらしい。（なんかGASでも似たようなことしたなぁ・・・）

ちょっと頭を整理するので、今日はここまで〜お疲れ様でした〜＾＾