感謝のプログラミング 10000時間

たどり着いた結果(さき)は、感謝でした。

JavaScriptでオブジェクトを作ってみる。

スポンサーリンク

JavaScriptを試しに実行するならJSFiddleを使うといい

開眼!JavaScriptを読んで初めて知ったんだけど「JSFiddle」というWebサイトを使えば簡単にJavaScriptのお試し実行環境が使えるようだ。
HTMLやCSSも試しに表示させることができるみたいで、かなり使い道がありそう。
http://jsfiddle.net/

ChromeでF12を押して、Consoleを表示する。
で、このjsFiddleの左の上から2番めのところにこんな感じのJavaScriptを書いて、左上の「Run」をクリックする。

var object1 = {
    object1_1 : {
        object1_1_1: { hoge: 'foo' },
        object1_1_2:{}
    },
    object1_2: {
        object1_2_1: {},
        object1_2_2: {}
    }
};

console.log(object1.object1_1.object1_1_1.hoge);

すろと、Consoleのところに

foo 

と表示される。

JavaScriptでオブジェクトを作成する

JavaScriptのオブジェクトは「名前と値を持つプロパティを格納するコンテナにすぎない」

var sho = new Object();

sho.living = true;
sho.name = sho;
sho.gender = 'male';
sho.job = 'programmer';

console.log(sho);

以下のように表示される。

Object {living: true, name: Object, gender: "male", job: "programmer"}

JavaScriptのオブジェクトにメソッドを追加してみる。

以下の例で言うと、helloの部分がメソッド。

var sho = new Object();
sho.name = 'sho';
sho.age = 28;
sho.hello = function() {
    alert("hello");
}
console.log(sho.hello());

上記を実行すると、ポップアップで「hello」と表示される。
オブジェクトは動的なプロパティを持つため、都度動的にオブジェクトプロパティを生成することができる。
ミュータブル(可変)オブジェクトと呼ばれる。

JavaScriptのネイティブオブジェクトコンストラクタ

JavaScriptは9つのネイティブオブジェクトコンストラクタを持つ。
・Number()
・String()
・Boolean()
・Object()
・Array()
・Function()
・Date()
・RegExp()
・Error()

プリミティブ型

JavaScript
3,'hoge',false,true,null,undefinedといった値はプリミティブ値と呼ばれる。
なぜかというと、既約(innreducible,これ以上単純化されない)であるためである。

プリミティブ型は、値がコピーされるので、他の変数に代入しても、元の値に影響は無い。
オブジェクト型は参照がコピーされるので、参照先の値が変化したら、他の参照変数にも影響がある。
この辺は最初は理解が難しいところ。
おととしくらいにパーフェクトJavaを読んでやっと理解できた。

プリミティブ型とオブジェクト型

var primitiveString = "hoge";
var objectString = new String('hoge');

console.log('test start!');
console.log(primitiveString); //hoge
console.log(objectString); //String {0: "h", 1: "o", 2: "g", 3: "e"} 
console.log(objectString.constructor); //function String() { [native code] } 
console.log(typeof primitiveString); //string 
console.log(typeof objectString);  //object 

コンソールの結果

test start! 
hoge 
String {0: "h", 1: "o", 2: "g", 3: "e"} 
function String() { [native code] } 
string 
object 

参考文献

開眼!  JavaScript ―言語仕様から学ぶJavaScriptの本質

開眼! JavaScript ―言語仕様から学ぶJavaScriptの本質


まさに眼が開かれたような気分になる。
薄くて読みやすい。サンプルがたくさんあってわかりやすい。

感謝のプログラミング

今回で感謝のプログラミングは【469時間目】
10000時間まで、あと【9531時間】