JavaScript之面向對象_動力節點Java學院整理

JavaScript的所有數據都可以看成對象，那是不是我們已經在使用面向對象編程了呢？

當然不是。如果我們只使用Number、Array、string以及基本的{...}定義的對象，還無法發揮出面向對象編程的威力。

JavaScript的面向對象編程和大多數其他語言如Java、C#的面向對象編程都不太一樣。如果你熟悉Java或C#，很好，你一定明白面向對象的兩個基本概念：

1.類：類是對象的類型模板，例如，定義Student類來表示學生，類本身是一種類型，Student表示學生類型，但不表示任何具體的某個學生；

2.實例：實例是根據類創建的對象，例如，根據Student類可以創建出xiaoming、xiaohong、xiaojun等多個實例，每個實例表示一個具體的學生，他們全都屬于Student類型。

所以，類和實例是大多數面向對象編程語言的基本概念。

不過，在JavaScript中，這個概念需要改一改。JavaScript不區分類和實例的概念，而是通過原型（prototype）來實現面向對象編程。

原型是指當我們想要創建xiaoming這個具體的學生時，我們并沒有一個Student類型可用。那怎么辦？恰好有這么一個現成的對象：

var robot = {
 name: 'Robot',
 height: 1.6,
 run: function () {
  console.log(this.name + ' is running...');
 }
};

我們看這個robot對象有名字，有身高，還會跑，有點像小明，干脆就根據它來“創建”小明得了！

于是我們把它改名為Student，然后創建出xiaoming：

var Student = {
 name: 'Robot',
 height: 1.2,
 run: function () {
  console.log(this.name + ' is running...');
 }
};
var xiaoming = {
 name: '小明'
};
xiaoming.__proto__ = Student;

注意最后一行代碼把xiaoming的原型指向了對象Student，看上去xiaoming仿佛是從Student繼承下來的：

xiaoming.name; // '小明'
xiaoming.run(); // 小明 is running...

xiaoming有自己的name屬性，但并沒有定義run()方法。不過，由于小明是從Student繼承而來，只要Student有run()方法，xiaoming也可以調用：

JavaScript的原型鏈和Java的Class區別就在，它沒有“Class”的概念，所有對象都是實例，所謂繼承關系不過是把一個對象的原型指向另一個對象而已。

如果你把xiaoming的原型指向其他對象：

var Bird = {
 fly: function () {
  console.log(this.name + ' is flying...');
 }
};
xiaoming.__proto__ = Bird;

現在xiaoming已經無法run()了，他已經變成了一只鳥：

xiaoming.fly(); // 小明 is flying...

在JavaScrip代碼運行時期，你可以把xiaoming從Student變成Bird，或者變成任何對象。

請注意，上述代碼僅用于演示目的。在編寫JavaScript代碼時，不要直接用obj.__proto__去改變一個對象的原型，并且，低版本的IE也無法使用__proto__。Object.create()方法可以傳入一個原型對象，并創建一個基于該原型的新對象，但是新對象什么屬性都沒有，因此，我們可以編寫一個函數來創建xiaoming：

// 原型對象:
var Student = {
 name: 'Robot',
 height: 1.2,
 run: function () {
  console.log(this.name + ' is running...');
 }
};
function createStudent(name) {
 // 基于Student原型創建一個新對象:
 var s = Object.create(Student);
 // 初始化新對象:
 s.name = name;
 return s;
}
var xiaoming = createStudent('小明');
xiaoming.run(); // 小明 is running...
xiaoming.__proto__ === Student; // true