javascript之繼承

lavor 發(fā)布于2019-08-21 14:34 / 3450人閱讀

摘要：阮一峰的講解構(gòu)造函數(shù)繼承動物構(gòu)造函數(shù)綁定大毛黃色動物模式大毛黃色動物如果替換了，都要為新的對象加上屬性，并將這個屬性指向原來的對象。

阮一峰的講解

構(gòu)造函數(shù)繼承

function Animal() {
    this.species = "動物";
}

function Cat(name,color) {
    this.name = name;
    this.color = color;
}

構(gòu)造函數(shù)綁定

function Cat(name,color) {
    Animal.apply(this,arguments);
    this.name = name;
    this.color = color;
}

var cat1 = new Cat("大毛","黃色");
alert(cat1.species); //動物

prototype模式

Cat.prototype = new Animal(); 
//Cat.prototype.constructor === Animal;
Cat.prototype.constructor = Cat;
var cat1 = new Cat("大毛","黃色");
alert(cat1.species); //動物

PS:如果替換了prototype，都要為新的prototype對象加上constructor屬性，并將這個屬性指向原來的對象。

直接繼承prototype

function Animal(){}
Animal.prototype.species = "動物";

Cat.prototype = Animal.prototype;
Cat.prototype.constructor = Cat;

與前一種方法相比，由于不用執(zhí)行和建立Animal的實例了，比較省內(nèi)存
缺點：Animal.prototype.constructor === Cat

利用空對象作為中介

var F = function(){};
F.prototype = Animal.prototype;
Cat.prototype = new F();
Cat.prototype.constructor = Cat;

F是空對象，幾乎不占內(nèi)存

拷貝繼承

function Animal(){}
Animal.prototype.species = "動物";

function extend(Child,Parent) {
    var p = Parent.prototype;
    var c = Child.prototype;
    for(var i in p){
        c[i] = p[i];
    }
}

非構(gòu)造函數(shù)的繼承

var  Chinese = {
    nation: "中國"
}；
var Doctor = {
    career: "醫(yī)生"
}

兩個對象都是普通對象，不是構(gòu)造函數(shù)，無法使用構(gòu)造函數(shù)方法實現(xiàn)繼承

object()方法

function object(o){
    function F(){};
    F.prototype = o;
    return new F();
}把子對象的prototype屬性指向父對象

var Doctor = object(Chinese);
Doctor.career = "醫(yī)生";
alert(Doctor.nation); // 中國

淺拷貝

function extend(p) {
    var c = {};
    for(var i in p){
        c[i] = p[i];
    }
    return c;
}

淺拷貝只能拷貝基本類型的數(shù)據(jù)

深拷貝

能夠?qū)崿F(xiàn)數(shù)組和對象的拷貝

function deepCopy(p,c){
    var c = c || {};
    for(var i in p){
        if(typeof p[i] === "Object"){
            c[i] = (p[i].constructor === "Array")? [] : {};
            deepCopy(p[i],c[i]);
        }else{
            c[i] = p[i];
        }
    }
    return c;
}

云服務(wù)器 GPU云服務(wù)器 javascript繼承 javascript繼承方法 Javascript實現(xiàn)繼承 javascript類的繼承

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/87949.html

相關(guān)文章

JavaScript深入之繼承的多種方式和優(yōu)缺點

摘要：深入系列第十五篇，講解各種繼承方式和優(yōu)缺點。優(yōu)點融合原型鏈繼承和構(gòu)造函數(shù)的優(yōu)點，是中最常用的繼承模式。寄生組合式繼承為了方便大家閱讀，在這里重復一下組合繼承的代碼組合繼承最大的缺點是會調(diào)用兩次父構(gòu)造函數(shù)。 JavaScript深入系列第十五篇，講解JavaScript各種繼承方式和優(yōu)缺點。寫在前面本文講解JavaScript各種繼承方式和優(yōu)缺點。但是注意：這篇文章更像是筆記，哎...

JackJiang 2019-08-20 16:30 評論0 收藏0
面向?qū)ο蟮?em>JavaScript之繼承(一) 類式繼承

摘要：那你們肯定會問為什么共用，而沒有共用呢，下面就給你解釋，請看引用類型是共用的值類型是私用的。引言面向?qū)ο蟮木幊陶Z言都具繼承這一機制,而 JavaScript 是基于原型(Prototype)面向?qū)ο蟪绦蛟O(shè)計,所以它的實現(xiàn)方式也是基于原型(Prototype)實現(xiàn)的. 繼承的方式類式繼承構(gòu)造函數(shù)繼承組合繼承原型式繼承寄生式繼承寄生組合式繼承 1.類式繼承 //聲明父...

forsigner 2019-08-20 14:21 評論0 收藏0
javascript面向?qū)ο?em>之“多態(tài)”

摘要：之前，本質(zhì)上不能算是一門面向?qū)ο蟮木幊陶Z言，因為它對于封裝繼承多態(tài)這些面向?qū)ο笳Z言的特點并沒有在語言層面上提供原生的支持。所以在中出現(xiàn)了等關(guān)鍵字，解決了面向?qū)ο笾谐霈F(xiàn)了問題。 ES6之前，javascript本質(zhì)上不能算是一門面向?qū)ο蟮木幊陶Z言，因為它對于封裝、繼承、多態(tài)這些面向?qū)ο笳Z言的特點并沒有在語言層面上提供原生的支持。但是，它引入了原型(prototype)的概念，可以讓我們以...

JerryWangSAP 2019-08-23 14:11 評論0 收藏0
面向?qū)ο蟮?em>JavaScript之繼承(二) 構(gòu)造函數(shù)繼承

摘要：引言創(chuàng)建即繼承構(gòu)造函數(shù)繼承何為構(gòu)造函數(shù)如果你還不清楚構(gòu)造函數(shù)和普通函數(shù)的區(qū)別那請看構(gòu)造函數(shù)與普通函數(shù)構(gòu)造函數(shù)繼承構(gòu)造函數(shù)繼承的核心是或的使用通過這個方法改變函數(shù)的作用環(huán)境為父類添加方法聲明子類子類通過將子類中的變量在父類中執(zhí)行了一遍由引言創(chuàng)建即繼承---構(gòu)造函數(shù)繼承何為構(gòu)造函數(shù)?如果你還不清楚構(gòu)造函數(shù)和普通函數(shù)的區(qū)別,那請看JavaScript構(gòu)造函數(shù)與普通函數(shù) 構(gòu)造函數(shù)繼承構(gòu)...

laoLiueizo 2019-08-20 14:22 評論0 收藏0
深入理解 Javascript 之繼承

摘要：繼承繼承子類可以使用父類的所有功能，并且對這些功能進行擴展。類繼承父類父類添加共有方法子類繼承父類子類添加共有方法其中最核心的一句代碼是將原型指向了父類的原型對象。繼承繼承：子類可以使用父類的所有功能，并且對這些功能進行擴展。繼承的過程，就是從一般到特殊的過程。類繼承 // 父類 var supperClass = function() { var id = 1; thi...

wuyangnju 2019-08-23 10:56 評論0 收藏0
【JavaScript】面向?qū)ο?em>之繼承

摘要：一繼承原型式繼承定義臨時構(gòu)造函數(shù)，作為參數(shù)傳入對象作為著構(gòu)造函數(shù)原型，并最后返回該構(gòu)造函數(shù)的實例對象定義一個臨時構(gòu)造函數(shù)遍歷對象屬性和方法將函數(shù)參數(shù)作為函數(shù)的原型姜構(gòu)造函數(shù)創(chuàng)造的對象進行返回犬夜叉借助構(gòu)造函數(shù)無論是原型鏈還是原型式繼承，都有 JS(JavaScript) 一.繼承1.原型式繼承定義臨時構(gòu)造函數(shù)，作為參數(shù)傳入對象作為著構(gòu)造函數(shù)原型，并最后返回該構(gòu)造函數(shù)的實例對象 func...

sewerganger 2019-08-26 12:16 評論0 收藏0