[JavaScript]JavaScript本格入門chapter5まで読んだメモ

Bloggerへの移行前のWordpressにて2013-04-20に投稿した記事です。

JavaScript本格入門　~モダンスタイルによる基礎からAjax・ｊQueryまで(amazon)のChapter5までを読んでメモっておこうと思ったコトをつらつらと。

オブジェクトリテラル(連想配列)のプロパティへのアクセス

var obj = {a:1, b:2, c:3};
alert(obj.a); // 1
alert(obj['a']); // 1

プロパティへのアクセス方法はドット演算子(.)もしくはブラケット構文の方法がある。

JavaScriptでは内部的に2進数で計算しているため、少数点を含む計算では誤差が発生

alert(0.2 * 3); // 0.600000.....1

これは0.6ではなく、0.600000000000…..1みたいになる。なので、if文とか使うときには注意が必要。

宣言した変数の確認

宣言した変数のデータ型を確認する際にはtypeof演算子を利用する。

var one = 1;
alert(typeof(one)); // number
var hello = 'hello';
alert(typeof(hello)); // string
var ary = [];
alert(typeof(ary)); // object

ただし、オブジェクト型の変数にtypeof演算子を利用すると全てobjectとなる。どのオブジェクトか判断するためにはinstanceof演算子を利用する。

var ary = [];
if(ary instanceof Array) {
    alert('ary is Array'); // aryがArrayの時に表示
}

try,cathc,finally構文もある

変数が未定義の場合、などのエラー検出が出来る。

try{
    alert(i);
} catch(e) {
    alert(e.message); // i is not definded
} finally {
    alert('finally'); // finally
}

上記例では、変数iが宣言されていないため、catch構文、finally構文が実行される。

Functionコンストラクタ経由で宣言する事で引数、関数本体を文字列として定義出来る。

関数の宣言をJavaScript組み込みのオブジェクトしてFunctionオブエジェクとが存在し、そのコンストラクタを利用して関数の定義が出来る。以下にコード例を示す。

var param = 'height, width';
var body = 'return height * width / 2;';
var function = new Function(param, body);

上記の記述法の利点として引数や関数本体を文字列で定義出来る。 上記により、例えば引数を変えたい場合、paramを変更し、関数の内容を変える場合にはbodyを変更すれば良い。

varを利用せず宣言された変数は全てグローバル変数扱い

ローカル変数のはずなのに何故かグローバル変数として参照されてしまっている場合には、この記述ミスを疑う。

関数で引数の数をチェックしない

function showName(name) {
    alert(name);
}

showName(); // undefined
showName('yamada'); // yamada
showName('yamada', 'kazuo'); // yamada

こんな感じで関数の引数と呼び出し元の引数の数が合わなくてもエラーとならない。関数の中でarguementsオブジェクトを使うと引数の数とかそれぞれの値が取得出来るので、柔軟な関数定義が出来る。

関数の引数,戻り値を関数で指定出来る。(高階関数)

タイトルの通り。 高階関数の引数として利用される関数がその場限りのみの利用の場合、匿名関数として利用するとコードがよりスマートとなる。

スコープチェーン

変数にどんな値が入っているか、というのは自分の階層から順番に上位の階層に向けて値が入っているかチェックしていくイメージ。

プロトタイプ

コンストラクタでメソッドを定義するとインスタンスの生成毎にメソッドを作成（メモリに確保）する。 上記より、メモリを多く利用してしまう。 この問題を解消する為に、メソッドを定義する場合にはprototypeプロパティを利用して宣言する方が余計なメモリを利用せずに良い。 以下にリテラル表現を利用してメソッドを定義した例を示す。

// class Car
var Car = function(name, company){
    this.name = name;
    this.company = company;
};

Car.prototype = {
    getInfo: function() {
        return 'Name = '+ this.name + ',Company = ' + this.company;
    }
};

var mycar1 = new Car('fit', 'honda');
alert(myCar1.getInfo());

静的メソッドの時、prototypeは利用出来ない。

タイトルの通り。宣言出来ない。 はまった。。。