みなさん、コウタロウです！！
前回の続きです。
今回は今までのJavaScriptガイドではなく、下記のサイトから
引用して継承について説明します。
九章第三回 継承 — JavaScript初級者から中級者になろう — uhyohyo.net
非常にわかりやすいサイトです。
ブックマークすることをオススメします！！
【目次】
継承とは
あるオブジェクトに対してさらに拡張したオブジェクトを
作ることです。
例えば、ゲームの雑魚キャラとボスキャラを創造して下さい。
この２つは、どちらも敵ですね。
その敵というオブジェクトを継承して
雑魚キャラと
ボスキャラ
という拡張したオブジェクトを作成します。
コードを見たほうが早いかな？
継承のやり方
gist9f8e5ccb43b3d25093d6c1cbfc5c72e5
紹介したサイトからの引用です。
１０行目の”Dragon.prototype”ですが、”prototype”はコンストラクタの
プロパティで”prototype”もオブジェクトになります。
１０行目ではこの”Dragon”オブジェクトの”prototype”に”Teki”オブジェクトを
代入し、１３行目では”Dragon.prototype”に”attack”メソッドを定義します。
これで、１７行目で”Dragon”インスタンスを作成し”Teki”オブジェクトを
継承することができます。
※８行目で”Teki”オブジェクトのインスタンスを呼び出しています。
つまり、２〜４行目が実行されます。
※出力結果は２１行目です。
以上で、継承のやり方が分かったかと思います。
次は、雑魚キャラ、ボスキャラについてオブジェクトを作る
サンプルを紹介します。
継承のサンプルソース
gist5a6e6590ddc87757bc244bf029794193
こちらも紹介したサイトからの引用です。
このサンプルはまさに継承のメリットがよく出ています。
”Teki”オブジェクトの１０〜１２行目と
“Dragon”オブジェクト の２０〜２２行目に
それぞれ”attack”メソッドがあります。
オブジェクトの型次第でどちらの”attack”メソッドが呼ばれるか
わかります。
２４行目は”Teki”オブジェクトでインスタンスを作成しているので
”Teki”オブジェクトの”attack”メソッドが
２５行目は”Dragon”オブジェクトでインスタンスを作成しているので
”Dragon”オブジェクトの”attack”メソッドが呼ばれます。
※出力結果は３４〜３７行目です。
どうでしたか？
継承ってネットで調べても難しいページばかりでわかりづらかったですが
紹介したサイトと私の記事を見て頂ければ継承を知らなかった方も理解で
きたんじゃないかと思います。
コメント