"Basic of JavaScript"は、株式会社まぼろし( http://maboroshi.biz/ )の新人・若手向けJavaScript入門資料です。
プログラムとは、値の振る舞いや取り回しをコンピューターに命令するために記述したものである。
JavaScriptでは、予め組み込まれているものも含め全ての値がオブジェクトであるかオブジェクトのように振る舞う。
オブジェクトとは、名前(キー)と値(バリュー)をペアとしたプロパティの集合で、中でも値に関数が与えられているものをメソッドと呼ぶ。
// オブジェクトは「名前:値」の集合
var object = {
propertyName: 'Value',
methodName: function () {
return 'Do something.'
}
}
全ての値がオブジェクトであるということは、そのオブジェクトに属しているプロパティやメソッドを利用できる、ということである。
プロパティはオブジェクトに . (ドット)を繋げることで呼び出し可能で、メソッドはそれに () (括弧)を加えることで実行することができる。
// オブジェクトに属しているプロパティを呼び出す
object.propertyName; // => 'Value'
// オブジェクトに属しているメソッドを実行する
object.methodName(); // => 'Do something.'
JavaScriptには予め組み込まれているオブジェクトがいくつかあり、扱いたい値の「型」によってそれらを使い分ける。
すなわち、値の型によって使用できるプロパティやメソッドがそれぞれにある。
「型」とはその値がどのような種類のものかを示す分類である。
コンストラクターとはオブジェクトのひな形のことで、インスタンスとはそのひな形から生成した値自体のことである。
新しく値を定義する際は「型」に応じたオブジェクトのコンストラクターからインスタンスを生成する。
インスタンスを生成するには new 演算子 を用いてコンストラクターを呼び出す。
// 「数値」オブジェクトのインスタンスを生成
var num = new Number(123); // => 123
値を定義するたびにコンストラクターを用いるのは冗長であるため、それぞれのオブジェクトには定義のショートカットとも呼べるリテラル記法が用意されている。
// 「数値」リテラルを生成
var num = 123;
プリミティブ値とはJavaScriptにおいては、オブジェクトでない純粋なデータのことである。
値をリテラルで用いようとした場合に、数値・文字列・真偽値はプリミティブ値として定義される。
プリミティブ値はオブジェクトではないためプロパティやメソッドを持っていないが、呼び出された際は自動的にラッパーオブジェクトが生成されるため、コンストラクターを通じて生成したインスタンスと同じように利用することができる。
// 「数値」リテラルはプリミティブ値
var num = 123;
num.toString(); // => '123'
undefined と null は特別な意味合いが与えられたプリミティブ値である。
値が「定義されていない」ことを示す値である。
// foo に「未定義(≒存在しない)」であること示す
var foo = undefined;
値が「空」であることを示す値である。
// foo に「空(存在はする)」であることを示す
var foo = null;
JavaScriptに予め組み込まれているオブジェクトのうち、MathオブジェクトとJSONオブジェクトは値に型を提供するコンストラクターとしての機能を持っていない。
これらのオブジェクトは謂わば便利ライブラリーで、それぞれにユーティリティとして様々な機能を提供する。
数学処理に必要な定数プロパティや演算メソッドを提供するオブジェクト。
// 円周率を示す定数
Math.PI; // => 3.141592653589793
// 絶対値を返すメソッド
Math.abs(-123); // => 123
JSONテキストを扱うためのメソッドを提供するオブジェクト。
// JSONテキストからObjectオブジェクトを生成する
JSON.parse('{"foo":"bar"}'); // => Object {foo: "bar"}
// ObjectオブジェクトをJSONテキストに整形する
JSON.stringify({foo: "bar"}); // => '{"foo":"bar"}'
普段何気なく使用しているjQueryの $(selector) は、セレクターにマッチするHTML要素から「jQueryオブジェクト」を生成するための記述である。
// jQueryオブジェクトを生成する
var jQueryObject = $('.foo');
// jQueryオブジェクトであるからjQueryのメソッドを利用することができる
jQueryObject.text('bar');
JavaScriptに予め組み込まれたオブジェクトが、それぞれにどのような型の値を扱い、どのようなプロパティとメソッドを持っているかを学ぶには「開眼! JavaScript」が推奨できる書籍である。
開眼! JavaScript ―言語仕様から学ぶJavaScriptの本質
# 目次
+ JavaScript オブジェクトと値の型