こんにちは、Yuiです。
今回は前回に引き続きJavaScript道場で学んだオブジェクト指向について解説をしていきます。
オブジェクト指向とは
まずJavaScriptにおける「オブジェクト」は、名前と値をもつプロパティを格納する入れ物にすぎません。つまり、オブジェクト＝データの入れ物です。
それでは「オブジェクト指向」とは何かというと、簡単にいうと「ソフトウェアで扱う事柄について、データと操作(メソッド)をまとめて１つのオブジェクトとして捉えること」を指します。
(オブジェクト指向の説明には色々な切り口があリ専門家の間でも微妙に食い違いますが、ここは共通しているはずです)
例えば、AさんとBさんの「歯を磨く動作」をプログラミングするとして考えると、以下の動作はAさん、Bさん関係なく共通のものですよね。
- 歯ブラシを手に取る
- 歯磨き粉をつける
- 歯ブラシを口に入れる
- 歯ブラシを口の中で動かす
- 歯ブラシを口から出す
- うがいをする
JavaScriptで言うなら一つ一つの動作は関数として表すことができますが、共通で使う関数が複数あるならまとめておいたほうが楽ですよね。
それをまとめて書けるというのが「オブジェクト指向プログラミング」の一つの利点です。コードを共通化することで、同じようなコードを何度も書く必要がなくなります。
注意点としては、同じコードだからといって何でも共通化すれば良いというわけではないので、そこは気をつけてください。
実際にオブジェクト指向プログラミングで書いてみよう
それでは実際にオブジェクト指向で書いてみましょう。（コードはMDNからの引用です）
例えばAとBの人物を用意して、Hi! I'm 〇〇.とアラートを出すだけの簡単なプログラムを書いてみます。
var personA = {
name: 'Bob',
greeting: function() {
alert('Hi! I\'m ' + this.name + '.');
}
}
var personB = {
name: 'Sarah',
greeting: function() {
alert('Hi! I\'m ' + this.name + '.');
}
}
この状態でpersonA.greeting()と入力すれば、Hi! I'm Bob.というアラートが出るという簡単なプログラムです。
ただ、これ2人だけならこのままでも良いかもしれませんが、100人、200人となると毎回この共通の部分をコピペするのはあまり好ましくないですよね。
そこで共通の部分をオブジェクト指向で書いてみます。
function Person(name) {
this.name = name;
this.greeting = function() {
alert('Hi! I\'m ' + this.name + '.');
};
}
let personA = new Person('Bob');
let personB = new Person('Sarah');
上記のように簡単に書くことができました。それぞれのgreetingメソッドは、自分自身のnameプロパティを内部で使っています。
このようにすることで今後人物を追加する際はlet 〇〇 = new Person('name')とすれば良いだけなので非常に簡単ですね。
ちなみに今回は簡単な例だったのですが、これから作るゲームではオブジェクト指向で書かないとコードがかなり冗長になってしまいます。小規模なコードだとイマイチ便利さが伝わりづらいですが、今後より実践的なプログラミングを学んでいけば、よりオブジェクト指向の便利さを理解できるかと思います。
また、今回さらっと書いた上記のコードに中にthisがありますが、これがわからない人も多いのではないでしょうか？
thisは慣れれば感覚的に使えるのですが、JavaScriptで書く上では欠かせないものになるので、次回はthisとは何かについて解説をしていきたいと思います。
最後までお読みいただきありがとうございました。