JavaScriptでのオブジェクトの作り方は簡単、らしい。今回はところどころ平語で書きますm(_ _)m

こちらの記事は元々Excel上で書いた物を、そのまま貼り付けたものです。その為、見づらいです。いつか、ExcelかPDFなどにして、貼り付けたいと思います。

JavaScriptでのオブジェクトの作り方は簡単。
{}の中に、プロパティを宣言するだけ。

例1:空のオブジェクト。
var 名前 = {};

例2:プロパティ(colorとlength)を持つ、オブジェクト(pencil)
var pencil = {
color:"red",
length:5
}



オブジェクトのプロパティを呼び出すには、次の様に書く。
オブジェクト.(←ドット)プロパティ名
先程の例2の場合、
pencil.colorと書くと、redが呼び出される。
pencil.lengthと書くと、5が呼び出される。
var 変数 = pencil.color; と書くと、変数の中にredが代入される。(はず)
◾️
逆に、オブジェクト.プロパティに値を代入することもできる。
例3:pencil.length = 3;
通常の変数とほぼ同じ様に使える。

◾️メソッド
メソッド→オブジェクトを操作する物のこと?
例4:プロパティ(colorとlength)を持つ、オブジェクト(pencil) は次の様になる。

var pencil = {
color:"red", ←プロパティ
length:5, ←プロパティ
draw:function(){ ←メソッド(たぶん…。lengthの値を操作しているので…)
this.length -= 0.01;
}

}


メソッドは、数値や文字列でなく、関数を定義する。
JavaScriptでは、プロパティもメソッドも同じ様に定義できる。
thisは、おそらくpencilのことを指している。(何度もpencilと書くのが面倒だから?)

書籍の中のサンプルプログラム→object-pen2.html

メソッドに引数を付けて渡すこともできる。
例4↓
draw:function(d){ ←dが引数。
this.length -= 0.01 * d;
d=4であれば、0.01*4が計算される。
}

普通の関数と似ているので、すぐに慣れるでしょう。(著者談)


似たようなオブジェクトが続く場合。
var pencil1 = {
color:"red",
length:5
}

var pencil2 = {
color:"blue",
length:5
}


数個なら対応できそうだが、数十個とかになると、嫌になってしまう。

※編集が大変になってきたので、続きは別の記事に書きます。m(_ _)m
続きはこちら↓↓↓

※参考文献


いいなと思ったら応援しよう!

佐野毅_プロダクトデザイナー+メカエンジニア_SANO_Takeshi
頂戴したチップ(サポート)は、レンタルサーバーの費用に充てさせて頂きます🙇 心より感謝いたします❤️