JavaScript 繼承流量分析

來源:互聯網
上載者:User

深入學習javascript繼承之前,先瞭解下面的幾個概念:
父類:被繼承的類
子類:由繼承得來的類
超類:也就是父類
抽象類別:一般不用來執行個體化的類,它的用途是用來給其他類繼承.
基類:提供給其他類可以繼承的類
衍生類別:由基類繼承而來的類

javascript對象繼承通常有下面的5種方式:
1.對象冒充
2.call()方式
3.apply()方式
4.原型鏈
5.混合方式

A.對象冒充
所謂對象冒充,就是新的類冒充舊的類(舊的類必須採用建構函式方式),從而達到繼承目的.
eg.1
複製代碼 代碼如下:
function people(name,sex,age){ //使用建構函式方式
this.name=name;
this.sex=sex;
this.age=age;
this.say=function(){
alert("My name is "+this.name);
};

this.doing=function(){
alert("I am speaking");
};
}
var Marry=new people("Marry","Woman","23");
Marry.say();
Marry.doing();

function white_people(name,sex,age){
this.inherit=people;
this.inherit(name,sex,age);
delete this.inherit;

this.area=function(){
alert("I am in Europe");
}
}
var Tom=new white_people("Tom","man","21");
Tom.say();
Tom.area();
alert(Tom.age);

上面的例子中,people是用來做white_people的基類,記住這個格式是用來對象冒充達到繼承目的的
this.inherit=people; //冒充
this.inherit(name,sex,age); //繼承
delete this.inherit; //刪除繼承
所有新屬性和新方法都必須再刪除了繼承後定義,這樣是為了避免覆蓋父類的相關屬性和方法.
另外,對象冒充支援多繼承.
eg.2
複製代碼 代碼如下:
function worker(pay,work){
this.pay=pay;
this.work=work;
}
function city_worker(name,sex,age,pay,work){
this.inherit=people;
this.inherit(name,sex,age);
delete this.inherit;

this.inherit=worker;
this.inherit(pay,work);
delete this.inherit;
}

var Jerry=new city_worker("Jerry","man","21","$1000","coder");
Jerry.say();
alert(Jerry.work);

對象冒充有一個不足的地方:多繼承機制實現時,如果基類存在相同的屬性或者方法,將從後面的類繼承.

B.call()方式
只是封裝的對象冒充的一個函數.這樣,我們不再需要寫"經典"的三句話,而是用下面這句話代替:
基類.call(對象,參數列表)
eg.1
複製代碼 代碼如下:
function farmer(name,sex,age,pay,work){
people.call(this,name,sex,age);
worker.call(this,pay,work);
}

var Nicholas=new farmer("Nicholas","man","27","$3000","irrigator");
Nicholas.say();
alert(Nicholas.pay);

同樣,call()存在同名屬性和方法的小問題.

C.apply()方式
和call()一樣.apply()也是對象冒充的一個封裝函數.其格式為:
基類.apply(對象,參數數組);
eg.1
複製代碼 代碼如下:
function white_collar(name,sex,age,pay,work){
people.apply(this,new Array(name,sex,age));
worker.apply(this,[pay,work]);
}

var Jiessie=new white_collar("Jiessie","woman","26","$2500","editor");
Jiessie.say();
alert(Jiessie.work);

同樣,apply()存在同名屬性和方法的小問題.

D.原型鏈
上面三種方式都是採用建構函式方式的繼承,對應地,也具有原型函數方式的繼承:原型鏈.
eg.1
複製代碼 代碼如下:
function blue_collar(){
}
blue_collar.prototype.name="Jean";
blue_collar.prototype.age="33";
blue_collar.prototype.say=function(){
alert("my name is "+ this.name);
};

function city_blue_collar(){
}
city_blue_collar.prototype=new blue_collar();

var jj=new city_blue_collar;
jj.say();

原型鏈也具有了原型鏈的缺點:不能傳遞參數.另外,原型鏈不支援多繼承,因為

E.混合方式
使用建構函式方式來寫類的屬性,對屬性的繼承採用call()或者apply()
使用原型方式來寫的方法,對方法的繼承採用原型鏈
eg.1
複製代碼 代碼如下:
function beauty(name,age){
this.name=name;
this.age=age;
}
beauty.prototype.say=function(){
alert("小女叫"+this.name);
};

function china_beauty(name,age,area){
beauty.call(this,name,age);
this.area=area;
}
china_beauty.prototype=new beauty();
china_beauty.prototype.from=function(){
alert("我來自"+this.area);
};

var diaochan=new china_beauty("貂禪","16","臨洮");
diaochan.say();
diaochan.from();
alert(diaochan.age);

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.