初心者による初心者のためのJavaScript講座Ⅷ|ゼロからのWeb制作 Vol.23

ペンギン,ジャバジャバ

ペンギン,ジャバジャバ

こんにちは、鈴木です。

JavaScriptについていろいろ書いてきて、だんだんネタが尽きてきましたが、今回も頑張ってJavaScriptについて書いていこうと思います。

目次

  1. オブジェクトとは何か?
  2. Arrayオブジェクト
  3. Dateオブジェクト

1.オブジェクトとは何か?

オブジェクトはプロパティとメソッドから構成された「データを操作するための様々な機能」を持つ入れ物と言えます。

オブジェクトは後に記述する組み込みオブジェクトを除き、new演算子を用いて利用されます。

オブジェクトに対し、アプリケーションが複数の箇所から異なる目的でデータを書き込んでしまったら、データは衝突し、アプリケーションは正常に動作しません。

そこでnew演算子を使い、オリジナルを複製することでデータの衝突を防ぐことができます。

JavaScriptにはnew演算子を使わずに使える組み込みオブジェクトというものがあり、本講座で使ったオブジェクトはすべてこの組み込みオブジェクトになります。

組み込みオブジェクトの一例として以下のようなものがあります。

  • Array
  • String
  • Math
  • Date
  • など

他にもいくつかあり、これらの組み込みオブジェクトは特別な宣言ををすることなく使うことができます。

今回は、本講座で出てきたArrayとDateについて詳しく見てこうと思います。

2.Arrayオブジェクト

JavaScript講座ⅢでArrayオブジェクトの説明を少ししたのですが、もう少し補足をしたいと思います。

Arrayオブジェクトは配列を扱う組み込みオブジェクトで、要素の追加、削除、結合、並び替えなどを行うことができます。

本講座ではArrayオブジェクトを


var ary=new Array(100,200,300)

のようにnew演算子を使いましたが、


var ary=[100,200,300]

のように書くことができます。

これをリテラル表現といいます。

リテラルとは、データ型に格納できる値そのもの、または、値の表現方法を言います。

例えば、Arrayオブジェクトにはpop()、push()といったメソッドがあります。こういったArrayオブジェクトでの利用可能なメソッドを書くことで、リテラル表現でもこれはArrayオブジェクトだとコンヒュータが認識してくれます。

また、Arrayオブジェクトのメソッドの一例としてpop()、push()の説明をします。

pop()は、配列の最後の要素を取得し、削除します。

push()は、配列の最後に要素を追加します。


var ary=[100,200,300]
ary.pop() //300を削除
document.writeln(ary); //[100,200]が表示
ary.push(400) //400を配列の最後に追加
document.writeln(ary); //[100,200,400]が表示

こんな感じになります。

3.Dateオブジェクト

JavaScript講座ⅥでDateオブジェクトが出てきました。

Dateオブジェクトは日付を操作する組み込みオブジェクトであり、Arrayオブジェクトのようにリテラル表現は存在しません。
なので、new演算子を使って表現することになります。

Dateオブジェクトのメソッドの一例を紹介したいと思います。


var d=new Date() //現在の日付
document.writeln(d.getFullYear()) //2014が表示
document.writeln(d.getMonth()) //10が表示
document.writeln(d.getDate()) //20が表示

まず、var d=new Date() はデフォルトのDateオブジェクトで、生成された日付を取得します。そして、Dateオブジェクトのメソッドである、getFullYear()、getMonth()、getDate()などを使って具体的な日付を取得します。

この記事を書いたのが、2014/11/20なので上記のような表示になります。

月は0から数え始めるため10が表示されます。

また、日付と時刻の差分を求める方法について紹介します。これは、直接Dateオブジェクトのメソッドでは求められないので次のように求めます。


var d1=new Date(2011,9,11); //2011/10/11
var d2=new Date(2011,10,20); //2011/11/20
var d0=(d2.getTime()-d1.getTime())/(1000*60*60*24); //
document.writeln(d0+"日"); //40日

まず求めたい日付を二つ書き、その差を求めます。

今回は、2014/10/11と2014/11/20の日付を設定しています。

getTime()は1971/01/01 00:00:00からの経過ミリ秒を取得します。

ミリ秒で差を求め一日をミリ秒にした値で割ると何日の差あるかが分かります。

今回は40日の差があることが分かりました。