気の向くままに辿るIT/ICT/IoT
JavaScript

JavaScriptで日時をデジタル表示 / Dateオブジェクトのメソッドにアクセス

ホーム前へ次へ
今日の日付と時間を表示させたい!『JavaScript』

JavaScriptで日時をデジタル表示 / Dateオブジェクトのメソッドにアクセス

JavaScript時計サンプル

JavaScript デジタル&アナログ時計サンプル

 ここでは、JavaScript デジタル&アナログ時計サンプルの内、リアルタイムの日付時刻表示と訪問日時、画面更新(リフレッシュ)時などその時点の日時を表示する2通りのデジタル時計の具体的な作り方を見ていきましょう。

ECMA-262 Edition 5.1 / ECMAScriptベースのJavaScript文法

ECMAScript / ECMA-262 Edition 5.1ベースのJavaScript

プロトタイプベースのオブジェクト指向

オブジェクト指向 / オブジェクトと種類 / プロパティ / インスタンス

Dateオブジェクトのメソッドにアクセスするには

 var d = new Date() ;

 d.toLocaleString ;

 d.toLocaleDateString ;

 d.toLocaleTimeString ;

 プロパティを利用する際には、ドット記法(かブラケット記法)を使ってアクセスしますが、Dateオブジェクトに限らず、prototypeオブジェクトが持つプロパティは、直接参照できる場合もありますが、基本的にそのオブジェクトをインスタンス化し、インスタンスで継承した各種プロパティを利用します。

 Dateオブジェクトとメソッドで挙げた先の各種メソッドは、実は、何れも prototypeオブジェクトが持つプロパティなのでDateオブジェクトをインスタンス化してから、そのインスタンス(例では、d )に対してドット記法を使ってアクセスすることになります。

 var d = new Date();

 document.write ( d.toLocaleString() );

 document.write ( d.toLocaleDateString() );

 document.write ( d.toLocaleTimeString() );

 その上で取得した日付時刻情報を出力する際に結果的にGlobalオブジェクトである window オブジェクトに属する documentオブジェクト、documentオブジェクトの出力関数(メソッド)である write() を使用する場合、このようになります。

 var dnow = Date.now() ;

 document.write ( Date.now() );

 document.write ( dnow );

 ちなみにDateオブジェクトの now ()メソッドは、 prototypeオブジェクトではなく、Dateオブジェクト自身が持つプロパティなのでインスタンスを使用することなく、Dateオブジェクトにドット記法を使って、このように直接アクセスすることが可能です。

 更にDateオブジェクトのprototypeプロパティ(オブジェクト)には、UTC(協定世界時)やGMT(グリニッジ標準時)関連のメソッドもあり、これらを使えば、相応の日付時刻文字列や数値を取得することも可能です。

 ただ、例えば、 toLocaleDateString() メソッドでは、月日が1~9月や1~9日の場合、1ケタ表示になってしまうけど、その部分だけ 0埋めして月や日の表示を常に2桁表示にしたいとか、時間文字列に"時"、"分"、"秒"といった文字列を加えたいという場合、これらのメソッドでは対応できませんし、他のメソッドでもそのまま使用できるものはない為、何らかの方法で加工する必要が出てきます。

 というわけで次は、Dateオブジェクトで利用可能なメソッドとそれが返す結果の一例と冒頭のサンプルを含めた日付時刻文字列の加工方法を見ていきましょう。

ECMAScript ECMA-262 第5.1版ベースのJavaScript

【ECMAScript / ECMA-262 Edition 5.1 訳】

 尚、下記リンクは、多くの場合、ページ情報量の過多を回避する為、場合によって更に章、節、句ごとに、任意に細分化し、ネストしている部分があります。

旧来掲載のJavaScript

ホーム前へ次へ