国民宿舎はらぺこ大浴場

JavaScript: どんな型の値でもとりあえずメンバフィールドに値を突っ込んでみるテスト ― 2010年08月05日 13時06分43秒

えー。長らく更新をサボって申し訳ない。しかも今回の内容は完全に個人的なメモなのでなおさら申し訳ないｗ

JavaScript って割とオブジェクト指向的な性格の強い言語だと思うんだけど、いわゆるオブジェクト型の値に限らず、関数型の値であってもメンバフィールドを持つことができたりして、その辺どうなっているのか、っていう辺りを整理しておきたかった。

で、以下のような HTML を書いてみたわけだ罠。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0//EN">
<html>

<head>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8">
	<meta http-equiv="content-style-type" content="text/css">
	<meta http-equiv="content-script-type" content="text/javascript">
	<title>member field test</title>
    <script type="text/javascript" language="JavaScript"><!--
window.onload = function() {
    var table = document.getElementById("result");
    if (table.firstChild.nodeName.toLowerCase() == "tbody") // IE6 対策
        table = table.firstChild;
    var testdata = [ 1, "", true, undefined, null, Infinity, NaN, function() {} ];
    for (var i = 0; i < testdata.length; i++) {
        var tr = document.createElement("tr");
        // 値を表示
        var td = document.createElement("td");
        td.appendChild(document.createTextNode(
            typeof testdata[i] == "function" ? testdata[i].toString() :
            typeof testdata[i] == "string" ? '"' + testdata[i] + '"' :
            testdata[i] === null ? "null" : // Gecko はこうしないと空欄になっちゃうので…
            testdata[i]));
        tr.appendChild(td);
        // 型を表示
        td = document.createElement("td");
        td.appendChild(document.createTextNode(typeof testdata[i]));
        tr.appendChild(td);
        // フィールドへの代入を試みる
        td = document.createElement("td");
        var result;
        try {
            testdata[i].hoge = "Hoge!!";
            result = testdata[i].hoge;
        }
        catch (ex) {
            result = ex.toString();
        }
        td.appendChild(document.createTextNode(result));
        tr.appendChild(td);
        table.appendChild(tr);
    }
};
    //--></script>
</head>

<body>

<table id="result" frame="border" border="1" rules="all">
  <tr><th>値</th><th>型</th><th>x.hoge</th></tr>
</table>

</body>

</html>

結果はこんな感じ。一応 IE6、Firefox、Safari にて動作確認済み。

結論をまとめると以下の通り。

ブラウザ間で動作の差異は見られなかった。
null の動作が意外なほど undefined の動作に酷似している。オブジェクト型のくせに。ていうか、全くの別物なのに。
メンバフィールドに入れた値をその後も利用できるのは、通常のオブジェクト型の値を除けば関数型の値のみ。
数値、文字列、真偽値については、メンバフィールドへの値の代入のようなことをやっても例外は発生しない。が、あとでそのフィールドを参照すると undefined が返される。中途半端な動作だな。 undefined と null は代入しようとした時点で例外が発生。
- ついでに言うと、undefined と null は toString() メソッドを適用することもできなかった (例外を送出する)。undefined についてはそも値ではない (より厳密には「インスタンスではない」) からということで納得がいくんだが、null についてはなんだろ…オブジェクトなんだけどオブジェクトじゃないものであるということをことさらに表現したい、ってことなのか??