JavaScript　#8　オブジェクト

2020年12月12日

前回までは、様々な関数に関して見てきました。今回は別のテーマ、オブジェクトに関してまとめていきます。
他のプログラミング言語と同様、JavaScript におけるオブジェクトも、現実世界の「もの」 (すなわちオブジェクト) になぞらえることができます。

プロパティ

オブジェクトにはプロパティ（特性）を持っています。ってなにそれ？って感じです。
例えば、コーヒーカップだったら、色、材質、容量、重さ、高さなどがあると思います。人ならば、名前、性別、身長、体重、年齢などを持っています。プロパティとはオブジェクトが保持している特性のことだと私は理解しています。

それでは具体的にオブジェクトを作って見ましょう。
以下は、私Q太郎のオブジェクトを作ってみました。おじさん個人情報情報のかたまりですね。
どこかで見たような書き方ですが、JavaScriptの連想配列と同じような書き方です。個人的には連想配列はオブジェクトを擬似的に連想配列として使っているからとの理解です。
以下のようにオブジェクト全体を指定すれば、オブジェクトの全部のプロパティが、「オブジェクト名.プロパティ名」とすれば特定のプロパティの値が取得できます。

let Person ={
  name : 'Qtaro',
  age : 42,
  sex : 'male',
  height : 175,
  weight : 80
};

console.log(Person);
console.log(Person.height);

メソッド

オブジェクトには特性として様々な値をもたせることができます。もちろん関数（オブジェクトではメソッド）をもたせることが可能です。それでは関数を追加していきましょう。
メソッドもプロパティの一つなので、カンマで区切り関数を作成していきます。以下のように挨拶をするだけのhelloQtaroメソッドができ、メソッドを呼び出すときは、「オブジェクト名.メソッド名」で呼び出せます。

let Person ={
  name : 'Qtaro',
  age : 40,
  sex : 'male',
  height : 175,
  weight : 80,

  helloQtaro(){
    console.log('こんにちはみなさん！！Q太郎です')
  }
};

Person.helloQtaro();

プロパティへのアクセス

折角オブジェクトを作成したのだから、オブジェクトのプロパティの値をメソッドでアクセスして更新してみましょう。
以下はPersonオブジェクトのweightプロパティを取得するcheckWeightメソッド、weightプロパティに対して足し算を行うoyatsuメソッドを作ってみました。無事に体重が増えましたね！
このように、オブジェクトのメソッドからプロパティをアクセスする際にはthisを使います。

let Person ={
  name : 'Qtaro',
  age : 40,
  sex : 'male',
  height : 175,
  weight : 80,

  oyatsu(weightUp){
    this.weight += weightUp;
  },

  checkWeight(){
    console.log('今の体重は'+ this.weight + 'です');
  }

};

Person.checkWeight();
Person.oyatsu(0.5);
Person.checkWeight();

以上、オブジェクト基礎を簡単にまとめてみました。

Program

Posted by Qtaro