JavaScript繼承總結

jas0n 發布于2019-08-23 11:40 / 2667人閱讀

摘要：創建對象字面量對象構造函數字面量字面量構造函數繼承原型鏈繼承在睡覺正在吃就是把實例賦值給，也就是說。構造函數繼承在睡覺正在吃構造函數繼承可以通過或方法實現繼承。

1.創建對象

1.字面量對象
2.構造函數
3.Object.create

//1.字面量
var obj={
    name: "字面量",
    show: function(){
        console.log(this.name)
    }
}
//2.構造函數
function fun (name) {
    this.name=name
}
var obj=new fun("obj")
//3.Object.create
var obj={name: "obj"}
var obj=Object.create(obj)

2.JavaScript繼承 1.原型鏈繼承

function Parent(name){
    this.name=name
    this.sleep=function(){
        console.log(this.name + "在睡覺")
    }
}
Parent.prototype.eat=function(food){
    console.log(this.name + "正在吃" + food)
}
function Child(){}
Child.prototype=new Parent("Child")
Child.prototype.constructor=Child
var child=new Child()

Child.prototype=new Parent("Child")就是把Parent實例賦值給Child.prototype，也就是說new Child().__proto__===new Parent("Child")。

可以通過Child.prototype在原型對象上增加新的屬性或方法，也可以通過，child.__proto__在原型對象上添加新的方法和屬性。

缺點：
1.原型對象上的屬性和方法是所有實例都可訪問的，而且一個實例改變了原型上的方法和屬性都會影響到其他實例。
2.創建子類實例時，無法向父類構造函數傳參。

2.構造函數繼承

function Parent(name){
    this.name=name
    this.sleep=function(){    
        console.log(this.name + "在睡覺")
    }
}
Parent.prototype.eat=function(food){
    console.log(this.name + "正在吃" + food)
}

function Child(){
    Parent.call(this,"child")
}
Child.prototype.eyes=function(){console.log("eyes")}
var child=new Child()

構造函數繼承可以通過call或apply方法實現繼承。這種方法不能繼承原型對象中的屬性和方法，只能繼承實例屬性和實例方法，但是可以向父類傳參。

3.組合繼承

function Parent(name){
    this.name=name
    this.sleep=function(){    
        console.log(this.name + "正在睡覺")
    }
}
Parent.prototype.eat=function(food){
    console.log(this.name + "正在吃" + food)
}
function Child(){
    Parent.call(this,"child")
}
Child.prototype.eyes=function(){console.log("eyes")}

Child.prototype=new Parent()
Child.prototype.constructor=Child 
var child=new Child()

組合繼承是比較好的繼承, 他是原型鏈繼承和構造函數繼承的結合, 合理的利用了這兩種組合的特點，既是子類的實例，也是父類的實例, 但有一個缺點就是調用了兩次構造函數。

4.組合繼承優化

function Parent(name){
    this.name=name
    this.sleep=function(){    
        console.log(this.name + "正在睡覺")
    }
}
Parent.prototype.eat=function(food){
    console.log(this.name + "正在吃" + food)
}
function Child(){
    Parent.call(this,"child")
}
Child.prototype = Object.create(Parent.prototype)
Child.prototype.constructor=Child 
var child=new Child()

5.寄生組合繼承

function Parent(name){
    this.name=name
    this.sleep=function(){    
        console.log(this.name + "正在睡覺")
    }
}
Parent.prototype.eat=function(food){
    console.log(this.name + "正在吃" + food)
}
function Child(){
    Parent.call(this,"child")
}
function f(){}
f.prototype=Parent.prototype
Child.prototype=new f()
Child.prototype.constructor=Child 
var child=new Child()

只調用一次父類的構造函數，避免了在子類原型上創建不必要的，多余的屬性。

GPU云服務器云服務器 javascript學習總結 javascript繼承 javascript繼承方法 Javascript實現繼承

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/97297.html

[原創] JavaScript中的繼承總結

摘要：中繼承比較復雜，坑比較多，最近有點時間整理下，記錄下來。的繼承實現方式大概分類如下的兩大類，每一種實現都有自己的有點和缺點，根據場景選擇吧通過修改原型鏈來來實現繼承通過復制父類來來實現繼承為了理解繼承的原型鏈的變化，我畫了原型鏈圖。 JS 中繼承比較復雜，坑比較多，最近有點時間整理下，記錄下來。 JS 的繼承實現方式大概分類如下的兩大類，每一種實現都有自己的有點和缺點，根據場景選擇吧 ...

sixgo 2019-08-21 10:48 評論0 收藏0
javascript原型（容易犯糊涂點的總結）

摘要：犯渾的地方中的原型繼承幾乎是面試必問點，然而真正透徹的理解它還是需要費一番功夫的，等等看到腦子就昏掉了，有時候以為自己掌握了，但是沒過多久看到角度不同的講解時就又犯糊涂了犯渾點中的構造函數，實例與原型之間的關系。在javascirpt中，每個對象都有一個指向它的原型對象的內部鏈接，這個原型對象又有自己的原型，一級一級鏈接上去，直到某個對象的原型為null,從而實現了繼承。犯渾的地方...

dongfangyiyu 2019-08-19 17:59 評論0 收藏0
「JavaScript」js中的繼承方法總結

摘要：缺點方法都在構造函數中定義，每次創建實例都會創建一遍方法組合繼承組合繼承融合原型鏈繼承和構造函數的優點，是中最常用的繼承模式然而組合繼承也有一個缺點，就是會調用兩次父構造函數。 1.前言本文完整代碼指路我的GitHub，歡迎star。js中的繼承方式有很多種，以下僅列出部分。 2.原型鏈繼承代碼如下： function Parent() { this.name = jche...

Cristic 2019-08-22 18:07 評論0 收藏0
基于原型的JavaScript繼承 - 面向對象的JavaScript - JavaScript核心

摘要：基于原型的繼承誠惶誠恐的寫下這篇文章。無論是還是，都是面向對象的。將這個新對象作為構造函數的執行上下文其指向這個對象，并執行構造函數返回這個對象原型繼承我們來定義一個簡單的類和它的原型我們在原型上定義了一個方法。源碼： https://github.com/RobinQu/Programing-In-Javascript/blob/master/chapters/JavaScr...

Acceml 2019-08-19 14:51 評論0 收藏0
基礎二：javascript面向對象、創建對象、原型和繼承總結（下）

摘要：當調用的構造函數時，在函數內部又會調用的構造函數，又在新對象上創建了實例屬性和，于是這兩個屬性就屏蔽了原型中的同名屬性。前言：這次對上篇收個尾，主要總結一下javascript的繼承。 1.原型鏈 js中原型鏈是實現繼承的主要方法。基本思想是：利用原型讓一個引用類型繼承另一個引用類型的屬性和方法。我們來簡單回顧一下以前的內容：每個構造函數都有一個原型對象每個原型對象都包含一個指...

617035918 2019-08-19 18:46 評論0 收藏0