大綱

• 物件基本概念

物件基本概念
JavaScript 除了原生型別 number、string、boolean、null、undefined 之外，幾乎都是物件，物件具有屬性 (properties) 與方法 (methods) 可以操作，使用『物件』來做程式設計模式稱為『物件導向程式設計』。

物件基本概念：認識物件導向
物件導向 (Object-oriented) 是程式開發設計的模式，顧名思義就是以物件為主的設計方法。

建立物件之前必須先定義物件的規格形式，稱為『類別 (class)』，也就是先定義好這個物件長什麼樣子以及要做哪些事情。類別定義的樣式，稱為 『屬性 (Properties)』，要做的事或提供的方法，稱為『類別 (Methods)』。『物件』則是由類別利用 new 關繫字建立的物件實體 (intance)，由類別建立物件實體的過程稱為『實體化 (Instantiation)』。

物件導向的三大特性，分別是『封裝 (Encapsulation)』、『繼承 (Inheritance)』與『多型 (Polymorphism)』，以下簡單說明這三大特性。

• 封裝：類別的內部成員封裝起來，他人不需要知道程式內部是如何實作，只能透過類別所提供的介面來操作公開的成員，達到『資料隱藏 (information hiding)』的效果，避免資料被任意修改及讀寫，也能過濾不必要或錯誤的資料。
• 繼承：利用舊的類別建立出新的類別，舊類別稱為『父類別』，新的類別則稱為『子類別』。子類別不但會保有父類別公開的屬性及方法，還能夠擴充自己的屬性與方法。如此一來，程式就可以重複利用。
• 多型：多行也稱為『同名異式』，簡單來說就是使用同一個介面，在不同的條件下執行不同的動作。

物件基本概念：JavaScript 的物件導向
JavaScript 雖然是物件導向程式語言，不過它與其他物件導向程式 (例如 C++、Java) 有很大的差別。因為 JavaScript 沒有真正的類別 (class) ! JavaScript 是以原型 (prototype-based) 為基礎的物鍵導向，用函數來當作類別 (class) 的建構子 (Constructor)，稱為建構子函數，用複製建構子函數的方式來模擬繼承。ES6 加入了 class 關鍵字來處理物件，但底層依然是原型 (prototype)，只是程式敘述看起來比較像一般認知的的類別寫法。以下先舉例 ES5 建構子函式及物件實體的寫法：

function Person(name, age) {    //建構子函式建立類別
  this.neme = name;
  this.age = age;
}
Person.prototype.showInfo = function() {    //定義 Person 共享的 showInfo 方法
  return '(' + this.name + ', ' + this.age + ')';
};
var girl = new Person('eileen', '18');    //物件實體
console.log(girl)

上面建立了一個名為 Person 的建構子函式，利用 var girl = new Person() 來建立 Person 的物件實體，在 JavaScript 中，只要物件都有預設一個公開的 prototype 屬性，prototype 就是所謂的『原型』，Person.prototype.showInfo 就會讓所有物件實體共用 showInfo 這個方法。

雖然 ES6 提供使用 class 關鍵字來定義類別，程式看起來很接近一般認知的物件導向，不過依然是以原型為基礎，只是以更簡潔的語法來建立物件。上面程式如果以 class 關鍵字來改寫，其寫法如下：

calss Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  showInfo() {
    return '(' + this.name + ', ' + this.age + ')';
  }
}
var girl = new Person('eileen', '18');
console.log(girl)