資訊專欄INFORMATION COLUMN
摘要：使用最多的繼承模式是組合繼承，這種模式使用原型鏈繼承共享的屬性和方法，而借用構(gòu)造函數(shù)繼承實(shí)例屬性。原型式繼承，可以在不必預(yù)先定義構(gòu)造函數(shù)的情況下實(shí)現(xiàn)繼承，其本質(zhì)是執(zhí)行給定對(duì)象的淺復(fù)制。
1、原型鏈實(shí)現(xiàn)繼承
function SuperType() {
this.property = true;
}
SuperType.prototype.getSuperValue = function() {
return this.property;
};
function SubType() {
this.subproperty = false;
}
//繼承了SuperType
SubType.prototype = new SuperType();
SubType.prototype.getSubValue = function() {
return this.subproperty;
};
var instance = new SubType();
alert(instance.getSuperValue()); //true
2、借用構(gòu)造函數(shù)
原型鏈的問(wèn)題是對(duì)象實(shí)例共享所有繼承的屬性和方法，因此不適宜多帶帶使用。解決這個(gè)問(wèn)題的技術(shù)是借用構(gòu)造函數(shù)，即在子類型構(gòu)造函數(shù)的內(nèi)部調(diào)用超類型構(gòu)造函數(shù)。這樣就可以做到每個(gè)實(shí)例都具有自己的屬性，同時(shí)還能保證只使用構(gòu)造函數(shù)模式來(lái)定義類型。
function SuperType() {
this.colors = ["red", "blue", "green"];
}
function SubType(){
//繼承了SuperType,
SuperType.call(this);//在子類型構(gòu)造函數(shù)的內(nèi)部調(diào)用超類型構(gòu)造函數(shù)
}
var instance1 = new SubType();
instance1.colors.push("black");
alert(instance1.colors); //"red,blue,green,black"
var instance2 = new SuperType();
alert(instance2.colors); //"red,blue,green"
3、組合繼承
思想：在子類型構(gòu)造函數(shù)的內(nèi)部調(diào)用超類型構(gòu)造函數(shù)。使用最多的繼承模式是組合繼承，這種模式使用原型鏈繼承共享的屬性和方法，而借用構(gòu)造函數(shù)繼承實(shí)例屬性。
function SuperType(name) {
this.name = name;
this.color = ["red","blue","green"];
}
SuperType.prototype.sayName = function() {
alert(this.name);
};
function SubType(name ,age) {
//繼承屬性
SuperType.call(this,name);//在子類型構(gòu)造函數(shù)的內(nèi)部調(diào)用超類型構(gòu)造函數(shù)
this.age = age;
}
//繼承方法
SubType.prototype = new SuperType();
SubType.prototype.constructor = SubType; //指向構(gòu)造函數(shù)
SubType.prototype.sayAge = function() {
alert(this.age);
};
var instance1 = new SubType("Nicholas", 29);
instance1.colors.push("black");
alert(instance1.colors); //"red,blue,green,black"
instance1.sayName(); //"Nicholas"
instance1.sayAge(); //29
var instance2 = new SubType("Greg" ,27);
alert(instance2.colors); //"red,blue,green"
instance2.sayName(); //"Greg"
instance2.sayAge(); //27
4、原型式繼承
（1）借助原型可以基于已有的對(duì)象創(chuàng)建新對(duì)象，同時(shí)還不必因此創(chuàng)建自定義類型
（2）在object()函數(shù)內(nèi)部，先創(chuàng)建了一個(gè)臨時(shí)性的構(gòu)造函數(shù)，然后將傳入的對(duì)象作為這個(gè)構(gòu)造函數(shù)的原型，最后返回這個(gè)臨時(shí)類型的一個(gè)新實(shí)例。
（3）原型式繼承，可以在不必預(yù)先定義構(gòu)造函數(shù)的情況下實(shí)現(xiàn)繼承，其本質(zhì)是執(zhí)行給定對(duì)象的淺復(fù)制。而復(fù)制的副本還可以得到進(jìn)一步的改造。
var person = {
name : "Nicholas",
friends : ["Shelby", "Court", "Van"]
};
var anotherPerson = object(perosn);
anotherPerson.name = "Greg";
anotherPerson.friends.push("Rob");
var yetAbotherPerson = object(perosn);
yetAbotherPerson.name = "Linda";
yetAbotherPerson.firends.push("Barbie");
alert(person.friends); //"Shelby, Court, Van, Greg, Linda"
5、寄生式繼承
與原型式繼承非常相似，也是基于某個(gè)對(duì)象或某些信息創(chuàng)建一個(gè)對(duì)象，然后增強(qiáng)對(duì)象，最后返回對(duì)象。為了解決組合繼承模式由于多次調(diào)用超類型函數(shù)而導(dǎo)致的低效率問(wèn)題，可以將這個(gè)模式與組合繼承一起使用。
function creatAnother(original) {
var clone = object(original); //通過(guò)調(diào)用函數(shù)創(chuàng)建一個(gè)新對(duì)象
clone.sayHi = function() { //以某種方式來(lái)增強(qiáng)這個(gè)對(duì)象
alert("hi");
};
return clone; //返回這個(gè)對(duì)象
}
var person = {
name : "Nicholas",
friends : ["Shelby", "Court", "Van"]
};
var anotherPerson = creatAnother(person);
anotherPerson.sayHi(); //"hi"
6、寄生組合式繼承
（1）集寄生式繼承與組合繼承的優(yōu)點(diǎn)于一身，是實(shí)現(xiàn)基于類型繼承的最有效的方式?？梢越鉀Q組合繼承調(diào)用兩次構(gòu)造函數(shù)導(dǎo)致子類最終會(huì)包含超類對(duì)象的全部實(shí)例屬性的問(wèn)題。
（2）寄生式組合繼承，就是通過(guò)借用構(gòu)造函數(shù)來(lái)繼承屬性，通過(guò)原型鏈的混成形式來(lái)繼承方法。其思想是：不必為了指定子類型的原型而調(diào)用超類型的構(gòu)造函數(shù)，我們所需的無(wú)非就是超類型原型的一個(gè)副本而已。本質(zhì)上就是，使用寄生式繼承來(lái)繼承超類型的原型，然再將結(jié)果指定給子類型的原型。其基本模式如下：
function inheritPrototype(SubType,superType) {
var prototype = object(superType.prototype); //創(chuàng)建對(duì)象
prototype.constructor = subType; //增強(qiáng)對(duì)象
subType.prototype = prototype; //指定對(duì)象
}
這個(gè)函數(shù)接收兩個(gè)參數(shù)：子類型構(gòu)造函數(shù)和超類型構(gòu)造函數(shù)。
第一步是創(chuàng)建超類型原型的一個(gè)副本;
第二步是為創(chuàng)建的副本添加constructor屬性，從而彌補(bǔ)因重寫(xiě)原型而失去的默認(rèn)的constructor屬性;
第三步將新創(chuàng)建的對(duì)象（即副本）賦值給子類型的原型。
function inheritPrototype(SubType,superType) {
var prototype = object(superType.prototype); //創(chuàng)建對(duì)象
prototype.constructor = subType; //增強(qiáng)對(duì)象
subType.prototype = prototype; //指定對(duì)象
}
function SuperType(name) {
this.name = name;
this.color = ["red","blue","green"];
}
SuperType.prototype.sayName = function() {
alert(this.name);
};
function SubType(name ,age) {
//繼承屬性
SuperType.call(this.name);
this.age = age;
}
inheritPrototype(SubType, SuperType);
SubType.prototype.sayAge = function() {
alert(this.age);
};
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/105949.html
摘要：探討判斷橫豎屏的最佳實(shí)現(xiàn)前端掘金在移動(dòng)端，判斷橫豎屏的場(chǎng)景并不少見(jiàn)，比如根據(jù)橫豎屏以不同的樣式來(lái)適配，抑或是提醒用戶切換為豎屏以保持良好的用戶體驗(yàn)。 探討判斷橫豎屏的最佳實(shí)現(xiàn) - 前端 - 掘金在移動(dòng)端，判斷橫豎屏的場(chǎng)景并不少見(jiàn)，比如根據(jù)橫豎屏以不同的樣式來(lái)適配，抑或是提醒用戶切換為豎屏以保持良好的用戶體驗(yàn)。 判斷橫豎屏的實(shí)現(xiàn)方法多種多樣，本文就此來(lái)探討下目前有哪些實(shí)現(xiàn)方法以及其中的優(yōu)...
摘要：大多數(shù)情況下，可以是同局部變量完成相同的事情而不引入新的作用域。選擇正確的方法避免不必要的屬性查找一旦多次用到屬性對(duì)象，應(yīng)該將其存儲(chǔ)在局部變量中。盡可能多的使用局部變量將屬性查找替換為值查找。 1、可維護(hù)性 1.1 可維護(hù)代碼特征 1. 可理解性 2. 直觀性 3. 可適應(yīng)性 4. 可擴(kuò)展性 5. 可調(diào)試性 1.2 代碼約定 1、可讀性（代碼縮進(jìn)和代碼注釋） 2、變量和函數(shù)命名 變量...
摘要：除此之外，在超類型的原型中定義的方法，對(duì)子類型而言也是不可兼得，結(jié)果所有類型都只能用構(gòu)造函數(shù)模式。創(chuàng)建對(duì)象增強(qiáng)對(duì)象指定對(duì)象繼承屬性這個(gè)例子的高效率體現(xiàn)在它只調(diào)用了一次構(gòu)造函數(shù)。 1、原型鏈 原型鏈的基本思想是利用原型讓一個(gè)引用類型繼承另一個(gè)引用類型的屬性和方法。構(gòu)造函數(shù)、原型和實(shí)例的關(guān)系：每個(gè)構(gòu)造函數(shù)都有一個(gè)原型對(duì)象；原型對(duì)象都包含著一個(gè)指向構(gòu)造函數(shù)的指針；實(shí)例都包含一個(gè)指向原型對(duì)象的...
摘要：創(chuàng)建構(gòu)造函數(shù)后，其原型對(duì)象默認(rèn)只會(huì)取得屬性至于其他的方法都是從繼承來(lái)的。上圖展示了構(gòu)造函數(shù)的原型對(duì)象和現(xiàn)有的兩個(gè)實(shí)例之間的關(guān)系。所有原生的引用類型都在其構(gòu)造函數(shù)的原型上定義了方法。 第6章我一共寫(xiě)了3篇總結(jié)，下面是相關(guān)鏈接：讀《javaScript高級(jí)程序設(shè)計(jì)－第6章》之理解對(duì)象讀《javaScript高級(jí)程序設(shè)計(jì)－第6章》之繼承 工廠模式 所謂的工廠模式就是，把創(chuàng)建具體對(duì)象的過(guò)程抽象...
摘要：從現(xiàn)在開(kāi)始，養(yǎng)成寫(xiě)技術(shù)博客的習(xí)慣，或許可以在你的職業(yè)生涯發(fā)揮著不可忽略的作用。如果想了解更多優(yōu)秀的前端資料，建議收藏下前端英文網(wǎng)站匯總這個(gè)網(wǎng)站，收錄了國(guó)外一些優(yōu)質(zhì)的博客及其視頻資料。 前言 寫(xiě)文章是一個(gè)短期收益少，長(zhǎng)期收益很大的一件事情，人們總是高估短期收益，低估長(zhǎng)期收益。往往是很多人堅(jiān)持不下來(lái)，特別是寫(xiě)文章的初期，剛寫(xiě)完文章沒(méi)有人閱讀會(huì)有一種挫敗感，影響了后期創(chuàng)作。 從某種意義上說(shuō)，...
閱讀 2949·2019-08-30 15:44
閱讀 2037·2019-08-29 13:59
閱讀 2899·2019-08-29 12:29
閱讀 1144·2019-08-26 13:57
閱讀 3262·2019-08-26 13:45
閱讀 3395·2019-08-26 10:28
閱讀 979·2019-08-26 10:18
閱讀 1753·2019-08-23 16:52
