一、原型繼承：

　　１、說起原型繼承，就要先由構造函數創造對象說起，首先了解構造函數內部基本原理：

　　　　　　（１）.在函數體最前面隱式的加上this = {}

　　　　　　（２）.執行 this.xxx = xxx;

　　　　　　（３）.隱式的返回this

　　　　并且要注意隱士創建的this對象中有個名為__proto__的屬性，其屬性值為該構造函數繼承的原型prototype。

　　　　而原型對象的有一個名為constructor的屬性，其屬性值為繼承之的構造函數，

　　　　所以可以通過這兩個屬性相互查看

　　2.原型的定義及一些特點：

　　　　a.定義：原型是function對象的一個屬性，它定義了構造函數制造出的對象的公共祖先。通過該構造函數產生的對象，可以繼承該原型的屬性和方法。原型也是對象。

　　　　b.利用原型特點和概念，可以提取共有屬性。

?

　　　　c.對象如何查看原型 — > 隱式屬性 __proto__

?

　　　　d.對象如何查看對象的構造函數 — > constructor

　　3、若一個構造函數沒有指定其原型，則其原型默認為Object.prototype

二、原型鏈：

　　1.原型的形成，最好的解釋就是代碼了,看如下代碼即可

　　

A.protorype = {name: 'a'}function A() (this.name = 'A';)B.prototype = new A();function B() {this.name = 'B';}C.prototype = new B();function C(){this.name = 'C';}C繼承B，B繼承A，形成C->B->A的一條以原型為繼承方式的原型鏈

?

?

　　2、原型鏈上屬性的增刪改查：

　　　　（1）查：優先去實例對象上尋找是否有該屬性，若沒有，則再去其對應的原型上去尋找該屬性，若都沒有，則返回undefined

　　　　（2）增：直接給實例對象增添屬性，則僅僅在實例對象上增添屬性，若在原型上增添屬性，則在原型上增添屬屬性，則在原型上增添屬性，其實例繼承原型增添的屬性。

　　　　（3）刪：delete僅僅能刪除實例對象的屬性，即構造函數原有的自己的屬性和后來實例對象增添的屬性，還有關于delete的一點需注意，delete無法刪除原型的屬性和用var定義的變量（即非window的屬性）

? 　　　?（4）改：更改實例對象的屬性，則僅僅更改實例對象的屬性值；更改原型的屬性值，則更改原型的屬性值，繼承該原型的對象對應屬性值也會被更改;

三、對象繼承的發展：

　　1、傳統模式：即正常的通過構造函數創建實例對象，來繼承原型

　　　　缺點：繼承了過多不必要的屬性

　　2、借用其他構造函數（即通過call / apply來改變構造函數內this對象的引用）

　　　　缺點：無法繼承借用構造函數的原型

　　　　

　　A.prototype = {name: 'a',age: 18,class: 1}function A(){this.name = 'A';}function B(){A.call(this);}var b = new B();console.log(b.name); // Aconsole.log(b.age) // undefined

?

　　3、共享原型：即將其他構造函數的原型直接賦值給本構造函數的原型

　　　　缺點：兩個原型會想回影響，更改其中一個原型，更一個對應的原型也會被更改。

　　

　　A.prototype = {name: 'a',age: 18,class: 1}function A(){this.name = 'A';}B.prototype = A.prototype;function B(){this.name = 'B';}
　　C.prototype = A.prototype;
　　function C() {
　　　　this.name = "C";
　　}
var a = new A();var b = new B();
var c = new C();console.log(a.age); // 18console.log(b.age); //18
console.log(c.age); //18

// 原型繼承成功B.prototype.age = 20; //更改其中一個原型的age屬性console.log(b.age);//20console.log(c.age); //20// 繼承A原型的B和C相互影響

?

　　4、圣杯模式：

　　　　　每次繼承的都是新創建的F構造函數實例，相互之間不會影響。其實此處針對F形成了閉包，Child引用了F，導致F不會銷毀。

　　　　（1）正常函數形式：

　　　　

　　function inherit (Child, Parent) {// 借用F這個中間量來繼承，而不是直接共享原型var F = function (){}F.prototype = Parent.prototype;Child.prototype = new F();// 自定義構造函數原型時，同時要更正自定義原型的constructor,否則一般默認為Object(),次函數若不指定constructor，則constructor為ParentChild.prototype.constructor = Child; Child.prototype.uber = Parent; //記錄真正繼承的是誰}

?

　　　　（2）閉包形式：

　　　　

　　 var inherit = (function(){var F = function (){};return function (Child, Parent) {F.prototype = Parent.prototype;Child.prototype = new F();Child.prototype.constructor = Child;Child.prototype.uber = Parent;}})();

?

轉載于:https://www.cnblogs.com/Walker-lyl/p/5592048.html

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的原型继承＋原型链 +　对象继承发展的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。