4、建構函式 + 原型 直接組裝一個類;同一建構函式將組裝出同一類型
通過前面幾篇得知javascript寫類無非基於建構函式 和原型 。既然這樣,我們寫個工具函數來寫類。
複製代碼 代碼如下:/**
* $class 寫類工具函數之一
* @param {Object} constructor
* @param {Object} prototype
*/
function $class(constructor,prototype) {
var c = constructor || function(){};
var p = prototype || {};
c.prototype = p;
return c;
}
嗯。工具類寫好了,來組裝下:用建構函式來產生類執行個體的屬性(欄位),原型對象用來產生類執行個體的方法。 複製代碼 代碼如下://建構函式
function Person(name) {
this.name = name;
}
//原型對象
var proto = {
getName : function(){return this.name},
setName : function(name){this.name = name;}
}
//組裝
var Man = $class(Person,proto);
var Woman = $class(Person,proto);
ok,這時候已經得到了兩個類Man,Woman。並且是同一個類型的。測試如下: 複製代碼 代碼如下:console.log(Man == Woman);//true
console.log(Man.prototype == Woman.prototype);//true
建立對象看看, 複製代碼 代碼如下:var man = new Man("Andy");
var woman = new Woman("Lily");
console.log(man instanceof Man);//true
console.log(woman instanceof Woman);//true
console.log(man instanceof Person);//true
console.log(woman instanceof Person);//true
ok一切如我們所期望。但是有個問題,下面代碼的結果輸出false, 複製代碼 代碼如下:console.log(man.constructor == Person);//false
這讓人不悅:從以上的代碼看出man的確是通過Man類new出來的 var man = new Man("Andy"),那麼對象執行個體man的構造器應該指向Man,但為何事與願違呢?
原因就在於$class中重寫了Person的原型:c.prototype = p;
好了,我們把$class稍微改寫下,將方法都掛在構造器的原型上(而不是重寫構造器的原型),如下: 複製代碼 代碼如下:function $class(constructor,prototype) {
var c = constructor || function(){};
var p = prototype || {};
// c.prototype = p;
for(var atr in p)
c.prototype[atr] = p[atr];
return c;
}