javascript必知必會：面象對象編程

作者：夢在旅途 2015-08-17 16:05:35

面象對象編程技術的核心理念：封裝、繼承、多態；在一些主流的高級編程語言中，比如：C#,VB.NET,JAVA,PHP等都是很容易實現的，而如果要在javascript中實現面象對象編程，可就不那么直接和容易了，因為 javascript并不是面向對象的語言，所以我們只能通過javascript的一些特性，比如：閉包、原型鏈等來模擬出面向對象編程，我認為這些是作為熟練掌握與靈活運用javascript的基礎，園子里已有很多的javascript高手對于這方面都有介紹與分析，而我僅以作為一個項目負責人（獨立設計與開發WEB前端與后端）的視角來重新理解javascript面向對

面象對象編程技術的核心理念：封裝、繼承、多態；在一些主流的高級編程語言中，比如：C#,VB.NET,JAVA,PHP等都是很容易實現的，而如果要在javascript中實現面象對象編程，可就不那么直接和容易了，因為 javascript并不是面向對象的語言，所以我們只能通過javascript的一些特性，比如：閉包、原型鏈等來模擬出面向對象編程，我認為這些是作為熟練掌握與靈活運用javascript的基礎，園子里已有很多的javascript高手對于這方面都有介紹與分析，而我僅以作為一個項目負責人（獨立設計與開發WEB前端與后端）的視角來重新理解javascript面向對象要點。

既然是面向對象，首先我們要知道如何創建一個對象，以下列出了創建對象的幾種常見方法：

A.直接創建一個對象實例：

//直接實例化一個對象

var Person1 = { Name: "夢在旅途", Age: 29, Sex: "男", Height: 178 };

alert(Person1.Name);

var Person2 = new Object();

Person2.Name = "夢在旅途";

Person2.Age = 29;

Person2.Sex = "男";

Person2.Height = 178;

alert(Person2.Name);

//這個是上面的簡寫

var Person3 = new Object({ Name: "夢在旅途", Age: 29, Sex: "男", Height: 178 });

alert(Person3.Name);

優點：直接創建一個對象，無需提前定義類型；

缺點：無法實現復用；

B.先定義后實例化對象:

//先定義類，再實例化成對象

function Person4(n,a,s,h) {

this.Name = n;

this.Age = a;

this.Sex = s;

this.Height = h;

}

var p4 = new Person4("夢在旅途", 29, "男", 178);

alert(p4.Age);

優點：類似面向對象編程語言的構造函數，容易理解，且定義后可通過new關鍵字實例化多個對象，實現復用。

缺點：需先定義后才能實例化；

綜上所述，建議采用B方法來創建對象。

實現封裝，即只暴露公共方法與公共屬性，隱藏實現細節（私有方法、屬性）

function Person5(n, a, s, h) {

//公共屬性

this.Name = n;

this.Age = a;

this.Sex = s;

this.Height = h;

//公共方法

this.AfterYear = function (count) {

updateAge(count);

alert(_currentYear +"后，我已經：" + this.Age +"歲了！");

};

this.Say = function () {

alert("我的個人信息－－> Name: "+ this.Name+", Age: "+ this.Age +", Sex: "+ this.Sex +", Height:" + this.Height);

}

//私有屬性與方法

var _self = this;

var _currentYear = 2015;

function updateAge(count) {

_currentYear += count;

_self.Age += count;

};

}

var p5 = new Person5("夢在旅途", 29, "男", 178);

p5.AfterYear(10);

p5.AfterYear(25);

利用原型鏈實現繼承，即一個對象包含另一個對象的所有公共屬性與方法，實現繼承的方法有很多，我覺得采用如下形式來模擬繼承更符合面向對象的思維：

function SoftEngineer(n, a, s, h, lang) {

Person5.call(this, n, a, s, h);//將Person5的所有屬性與方法包含到SoftEngineer中，從而實現繼承

this.Lang = lang;

this.SayCode = function () {

alert("我是一名軟件工程師，我會" + this.Lang + "編程語言！");

}

this.Working = function () { };//空方法，類似面向對象中的虛方法

}

SoftEngineer.prototype = new Person5(); //將SoftEngineer的原型指定Person5的實例

var softengr = new SoftEngineer("夢在旅途", 29, "男", 178, "javascript");

softengr.Say();

softengr.SayCode();

利用原型鏈實現多態，即基于同一個方法簽名在不同的子類中表現的形式不同：

function WebSoftEngineer(n, a, s, h, lang) {

SoftEngineer.apply(this, [n, a, s, h, lang]);

this.Working = function () {

alert("我是網頁工程師，從事網頁開發設計工作！");

};

WebSoftEngineer.prototype = new SoftEngineer();

function AppSoftEngineer(n, a, s, h, lang) {

SoftEngineer.apply(this, [n, a, s, h, lang]);

this.Working = function () {

alert("我是應用工程師，從事客戶端應用程序開發設計工作！");

};

AppSoftEngineer.prototype = new SoftEngineer();

var webengr = new WebSoftEngineer("夢在旅途", 29, "男", 178, "javascript");

webengr.Say();

webengr.Working();

var appengr = new AppSoftEngineer("夢在旅途", 29, "男", 178, "c#");

appengr.Say();

appengr.Working();

責任編輯：王雪燕來源：博客園

javascript 對象編程