Javascriptメモ 
提供: Astarisk Works Wiki
目次 |
==(等値演算子)と===(同値演算子)
==はJavaと同じようにこの演算子の左右の値が等値かどうかを判定するが、javascriptには===もある。その違いをまとめる。
a == b がtrueとなる条件
aはbに等しいと読んで覚えよう!
基本的にa,bの型が違う場合、どちらかの型にそろえてから比較する。。 trueは1にfalseは0に変換される
- aとbの型が違うが、値は同じ
- aがnullでbが未定義値の場合(a,bの値が逆でも可)
- aが数値でbが文字列の場合にbを数値に変換して同じ値の場合(a,bの値が逆でも可)
x === y がtrueとなる条件
xはyと同値であると読んで覚えよう
- xとyが同じ型である
- x,yともに数値で同じ値
- x,yともに文字列で、同じ文字が同じ位置にある場合
- x,yの両方が論理値trueである場合、またはfalseの場合
- x,yの両方が同じオブジェクトや配列、関数を参照している場合
- x,yの両方がnullの場合、あるいは未定義の場合
オブジェクトのプロパティを調べる
次の関数を実装し、使えばよい。
function DispPropName(obj){
var names = "";
for(var name in obj) names += name + "/n";
alert(names);
}
ただし、ユーザ定義のプロパティはすべて調べられるが、あらかじめ定義されたプロパティには調べられないものもあることに注意。
プロパティの存在確認
あるプロパティがそのオブジェクトに定義されているかどうかはin演算子を使えば調べられる。
次の例ではobjにプロパティpropがあればalertを表示する。プロパティ名を文字列として指定することに注意。
if("prop" in obj) alert("obj has prop !");
オブジェクトのプロパティを削除する
プロパティをオブジェクトから削除するにはdelete 演算子を使う。 deleteしてしまうとfor/inで調べてもin演算子で調べても見つからなくなる。
次の例はobjのpropプロパティを削除する。
delete obj.prop;
可変長引数を持つ関数を作る
数が決められないリストや配列を引数に取る関数を作りたいときがある。
そういう場合にはargumentsが使える。
argumentsプロパティは関数の中で利用でき、Augumentsオブジェクトを参照する特別なプロパティである。
関数に渡された引き数値はargument[]配列の要素として格納される。つまり、auguments配列に数値インデックスでアクセスすると関数に渡されたすべての引数値に自由にアクセスできる。
サンプルコードを以下に示す。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>argumentsの練習</title>
</head>
<body>
<div id="result"></div>
</body>
</html>
<script>
function test() {
str=null;
for (var i=0;i< arguments.length;i++){
str=str + "<br/>" + arguments[i];
}
document.getElementById('result').innerHTML=str;
}
test(1,2,3);
</script>
addEventListenerについて
- addEventListenerメソッドの一つ目の引数には，イベント名を指定する。イベントハンドラの名前ではonがつくが、先頭にonを入れてはいけない点に注意。
- 二つ目の引数には，イベントを補足した時に実行したい関数オブジェクトを指定する。事前に関数オブジェクトを定義したうえで，そのオブジェクト名を記述する。
- 三つ目の引数は，補足したいイベントのフェーズを指定するが，falseを指定するとバブリング・フェーズで，trueを指定するとキャプチャー・フェーズとなる。
バブリングフェーズはイベント発生源から上位のタグにイベントが伝播する。キャプチャーフェーズは逆に下位のタグにイベントが伝播する。IEにはバブリングフェーズしかないので注意。
変数、関数の隠蔽と公開
他のJavascriptとの変数や関数の衝突を避けるため次のクロージャが使われることが多い
(function() {
//処理を実装する
})();
このクロージャ内で定義した関数や変数は当然、外からは見えないので、必要ならオブジェクトにくるんで外からアクセスできるようにする。
(function() {
// コンストラクタ関数の定義
var MyObject = function() {
・・・
}
MyObject.prototype = {
・・・
}
// 名前空間 window.myobj に公開
window.myobj = new MyObject();
})();
