2019獨(dú)角獸企業(yè)重金招聘Python工程師標(biāo)準(zhǔn)>>>

【下載Infragistics Ultimate最新版本】

用javascript創(chuàng)建對象有四種方法。具體如下：

對象作為文本

構(gòu)造函數(shù)調(diào)用模式

創(chuàng)建（）方法

在ES6之后使用類

繼承的實(shí)現(xiàn)因?qū)ο髣?chuàng)建方法而異。本文將解釋如何在函數(shù)構(gòu)造函數(shù)之間創(chuàng)建繼承。

假設(shè)您有一個(gè)函數(shù)：

1 2 3 4

function animal(name, age) { ????this.name = name; ????this.age = age; }

如果使用new操作符調(diào)用animal函數(shù)，將創(chuàng)建一個(gè)對象。這種對象創(chuàng)建方式也稱為“構(gòu)造函數(shù)調(diào)用模式”。

1 2 3 4

var dog =?new animal('foo', 5); console.log(dog); var cat =?new animal('koo', 3); console.log(cat);

對象dog和cat都有自己的名稱和年齡屬性。如果希望在所有對象之間共享屬性或方法，請將其添加到函數(shù)原型中。

1 2 3 4

animal.prototype.canRun =?function () { ?? ????console.log('yes ' +?this.name +?' can run !'); }

使用javascript原型鏈，dog和cat對象都可以訪問canrun方法。

1 2 3 4 5

var dog =?new animal('foo', 5); dog.canRun();?// yes foo can run ? var cat =?new animal('koo', 3); cat.canRun();?// yes koo can run

接下來，讓我們創(chuàng)建另一個(gè)構(gòu)造函數(shù)——人：

1 2 3 4 5 6 7 8

function human(name, age, money) { ????this.name = name ; ????this.age = age ; ????this.money = money; } human.prototype.canEarn =?function () { ????console.log('yes ' +?this.name +?'can earn'); }

此時(shí)，人與動(dòng)物的功能沒有任何關(guān)系。然而，我們知道人也是動(dòng)物。人工構(gòu)造有兩個(gè)問題。

它有重復(fù)的名稱和年齡初始化代碼。為此，應(yīng)使用動(dòng)物建造師。

它與動(dòng)物建造師沒有任何聯(lián)系

上述兩個(gè)問題可以通過在動(dòng)物和人類功能構(gòu)建者之間創(chuàng)建繼承來消除。

您可以通過如下修改人工函數(shù)來解決代碼復(fù)制的問題1：

1 2 3 4

function human(name, age, money) { ????animal.call(this, name, age); ????this.money = money; }

現(xiàn)在，在人類函數(shù)中，我們使用call方法手動(dòng)傳遞當(dāng)前對象作為動(dòng)物函數(shù)中“this”的值。這種方法也稱為間接調(diào)用模式。現(xiàn)在，可以創(chuàng)建一個(gè)人類對象實(shí)例，如下所示：

1 2	var h1 =?new human('dj', 30,?'2000 $'); console.log(h1);

到目前為止，我們已經(jīng)解決了代碼復(fù)制的第一個(gè)問題，但是人類的功能仍然與動(dòng)物的功能無關(guān)。如果您嘗試對h1對象調(diào)用canrun方法，javascript將向您拋出一個(gè)錯(cuò)誤。

1	h1.canRun();?// throw error canRun is not a function

您可以通過將人類功能原型與動(dòng)物功能構(gòu)造函數(shù)原型鏈接來解決這個(gè)問題。有兩種方法可以做到這一點(diǎn)。

使用γ原型

使用object.create（）方法

您可以使用object.create（）鏈接函數(shù)構(gòu)造函數(shù)的原型，如下所示：

1	human.prototype = Object.create(animal.prototype);

您可以使用_uu proto_uuu鏈接函數(shù)構(gòu)造函數(shù)的原型，如下所示：

1	human.prototype.__proto__ = animal.prototype;

更推薦object.create（）方法，因?yàn)樵谠S多瀏覽器中可能不支持_uuProto。在鏈接原型之后，在一種方式下，您已經(jīng)在動(dòng)物和人類函數(shù)構(gòu)造函數(shù)之間創(chuàng)建了繼承。人的對象實(shí)例可以讀取動(dòng)物功能的所有屬性，并且可以執(zhí)行動(dòng)物功能方法。

下面列出了實(shí)現(xiàn)函數(shù)構(gòu)造函數(shù)之間繼承的完整源代碼，供您參考：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31

function animal(name, age) { ?? ????this.name = name; ????this.age = age; ?? } ?? animal.prototype.canRun =?function () { ?? ????console.log('yes ' +?this.name +?' can run !'); } ?? var dog =?new animal('foo', 5); dog.canRun(); ?? var cat =?new animal('koo', 3); cat.canRun(); function human(name, age, money) { ????animal.call(this, name, age); ????this.money = money; } ?? human.prototype = Object.create(animal.prototype); ?? human.prototype.canEarn =?function () { ????console.log('yes ' +?this.name +?'can earn'); } // human.prototype.__proto__ = animal.prototype; var h1 =?new human('dj', 30,?'2000 $'); h1.canRun(); h1.canEarn();

要在函數(shù)構(gòu)造函數(shù)之間創(chuàng)建繼承，請始終執(zhí)行以下兩個(gè)操作：

使用call或apply調(diào)用父構(gòu)造函數(shù)。

將子構(gòu)造函數(shù)原型鏈接到父構(gòu)造函數(shù)原型

轉(zhuǎn)載于:https://my.oschina.net/u/4009527/blog/2995846

總結(jié)

以上是生活随笔為你收集整理的【Infragistics教程】在javascript构造函数中创建基本继承的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。