JS memo

お洒落にJavaScript。

2019年4月7日13:31

Javascriptのオブジェクト指向をラーメンに例えてみた

メインビジュアル

Javascriptのオブジェクト指向をラーメンに例えてみた

オブジェクト指向プログラミングとは何なのかを理解するために オブジェクト指向プログラミングの4つの特徴(カプセル化、抽象化、継承、ポリモーフィズム)をラーメンで説明してみました。

目次
  1. カプセル化
  2. 抽象化
  3. 継承
  4. ポリモーフィズム
  5. まとめ
  6. 参考にしたサイト

カプセル化

まずオブジェクト指向プログラミングの一つの特徴として、物や対象物(オブジェクト)のデータとデータの扱う方法をまとめてカプセル化することができます。 このデータをプロパティー、データの扱う方法をメソッドと呼びます。

ラーメンを注文する時はサイズや麺の硬さ、スープの種類などを選んで頼み、そのデータからラーメンが作られます。

実際にjavascriptのコードをみてください。(ここではサイズと麺は固定でスープのみ選択できます。)

function Order(soup){
  this.soup = soup;
}
Order.prototype.create_ramen = function(){
  console.log(this.soup + "ラーメン完成!");
}
const order1 = new Order("醤油");
order1.create_ramen(); //醤油ラーメン完成!

上記の例ではsoupがプロパティー、create_ramen()がメソッドとなり、Orderというコンストラクターにまとめられています。

つまりラーメン抜きでこれらの言葉を説明すると

プロパティー ▼
物や対象物が保持する情報

メソッド ▼
情報(プロパティー)の処理

となります。

抽象化

例えば、ラーメン屋では材料を調達、仕込み、ラーメンを作るという工程がありますが、注文する際はその工程を知らなくても好きなラーメンを選べばいいですよね。

先ほどのjavascriptのコードの一部をみてください。

const order1 = new Order( "醤油");

create_ramen()がどのような構造になっているか分からなくても注文することが可能です。

このようにオブジェクト指向プログラミングは複雑になっている部分をしらなくても簡単に実装できるのが特徴です。 Javascriptのプロジェクトが大きければ大きいほどコードも複雑になり更新も難しくなります。オブジェクト指向プログラミングではこの問題を解決するために複雑な部分を隠してシンプルに操作できるような仕様になっています。

継承

先ほどのオーダーに加えてトッピングをしたい場合を考えてみましょう。

もし煮卵をトッピングしたラーメンを作成する場合、以下のように先ほどのオーダーの要素を引き継いで、さらにトッピングもオーダーできるコードを作成してみましょう。

function Order2(soup, topping){
  Order.call(this, soup);
  this.topping = topping;
}
Order2.prototype = Object.create(Order.prototype);
Order2.constructor = Order2;
Order2.prototype.create_ramen = function(){
  console.log(this.soup + "ラーメン" + this.topping + "トッピング完成!");
}

const order2 = new Order2("醤油", "煮卵");
order2.create_ramen(); //醤油ラーメン煮卵トッピング完成!

上記の例のようにオブジェクト指向プログラミングでは親のコンストラクターから要素を引き継いで、かつ新たなプロパティーやメソッドを追加したコンストラクターを作成できます。

ポリモーフィズム

今までcreate_ramen()メソッドを持つOrder()とOrder2()の二種類のコンストラクターを作成しました。 これらのコンストラクターは同一メソッドcreate_ramen()を持っていますが、以下のようにそれぞれ違う結果を出力します。


const order1 = new Order("醤油");
const order2 = new Order2("醤油", "煮卵");
order1.create_ramen(); //醤油ラーメン完成!
shoyuramen.create_ramen(); // 醤油ラーメン煮卵トッピング完成!

このように同じメソッドであってもコンストラクターによって振る舞いが違うと性質をポリモーフィズムといい、オブジェクト指向プログラミングの一つの特徴です。

まとめ

オブジェクト指向プログラミングとは何なのかを出来るだけシンプルに想像しやすい例えで説明してみました。 オブジェクト指向プログラミングの概念を理解するのに、私の記事が少しでも役立てば嬉しいです。

参考にしたサイト

How to explain object-oriented programming concepts to a 6-year-old