理解JS非構(gòu)造函數(shù)繼承

Cristic 發(fā)布于2019-08-19 18:04 / 2551人閱讀

摘要：即對(duì)象為非構(gòu)造函數(shù)，普通函數(shù)繼承另一個(gè)普通函數(shù)。方法淺拷貝深拷貝推薦方法發(fā)明人，提出的函數(shù)。該函數(shù)就是把子對(duì)象的屬性，指向父對(duì)象。

即對(duì)象為非構(gòu)造函數(shù)，普通函數(shù)繼承另一個(gè)普通函數(shù)。

object()方法

淺拷貝

深拷貝（推薦）

object()方法

json發(fā)明人Douglas Crockford，提出的object()函數(shù)。

function object(o) {
    function F() {}
    F.prototype = o;
    return new F();
}

該函數(shù)就是把子對(duì)象的prototype屬性，指向父對(duì)象。使用時(shí)依然是先繼承后定義子對(duì)象的方法和屬性

var parent = {
    name: "Oliver"
};
var child = object(parent); //先繼承
child.age = 18; //后定義
console.log(child.name); //Oliver
console.log(child.age); //18

淺拷貝

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

該方法只能繼承基本數(shù)據(jù)類(lèi)型，如果父對(duì)象有數(shù)組等對(duì)象，拷貝的只是個(gè)地址，子對(duì)象屬性的改變會(huì)導(dǎo)致父對(duì)象屬性的改變（篡改問(wèn)題）

var parent = {
    name: "Oliver",
    friend: [1,2,3]
};

var child = extend(parent); //先繼承
child.age = 18;

console.log(child.name); //Oliver
console.log(child.age); //18
child.friend.pop();
console.log(child.friend); //兩者都改變了
console.log(parent.friend); //兩者都改變了

深拷貝

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;　　
}

該方法原理是遞歸調(diào)用"淺拷貝"

var parent = {
    name: "Oliver",
    friend: [1, 2, 3]
};

var child = deepCopy(parent); //先繼承
child.age = 18;

console.log(child.name); //Oliver
console.log(child.age); //18
child.friend.pop();
console.log(child.friend); //[1, 2]
console.log(parent.friend); //[1, 2, 3]

云服務(wù)器 GPU云服務(wù)器繼承構(gòu)造函數(shù) 構(gòu)造函數(shù) 繼承非構(gòu)造函數(shù) JS構(gòu)造函數(shù)

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

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/79164.html

相關(guān)文章

面向?qū)ο蟮?JavaScript

摘要：是完全的面向?qū)ο笳Z(yǔ)言，它們通過(guò)類(lèi)的形式組織函數(shù)和變量，使之不能脫離對(duì)象存在。而在基于原型的面向?qū)ο蠓绞街?，?duì)象則是依靠構(gòu)造器利用原型構(gòu)造出來(lái)的。 JavaScript 函數(shù)式腳本語(yǔ)言特性以及其看似隨意的編寫(xiě)風(fēng)格，導(dǎo)致長(zhǎng)期以來(lái)人們對(duì)這一門(mén)語(yǔ)言的誤解，即認(rèn)為 JavaScript 不是一門(mén)面向?qū)ο蟮恼Z(yǔ)言，或者只是部分具備一些面向?qū)ο蟮奶卣?。本文將回歸面向?qū)ο蟊疽猓瑥膶?duì)語(yǔ)言感悟的角度闡述為什...

novo 2019-08-21 10:49 評(píng)論0 收藏0
獨(dú)家解析Javascript原型繼承

摘要：面向?qū)ο髮?shí)現(xiàn)代碼動(dòng)物發(fā)聲汪汪喵喵調(diào)用代碼動(dòng)物發(fā)聲喵喵動(dòng)物發(fā)聲汪汪當(dāng)要增加一種動(dòng)物時(shí)，只需增加一個(gè)繼承，不會(huì)影響其他已有的動(dòng)物邏輯。所以的繼承和的原型繼承，可謂殊途同歸。傳統(tǒng)面向?qū)ο蟮睦^承和多態(tài) 我們知道C++／Java／C#等面向?qū)ο笳Z(yǔ)言，都原生地支持類(lèi)的繼承。繼承的核心作用大抵是創(chuàng)建一個(gè)派生類(lèi)，并使其復(fù)用基本類(lèi)（即父類(lèi)）的字段和／或方法。并且派生類(lèi)可以重寫(xiě)基本類(lèi)的方法。這樣基本類(lèi)和...

verano 2019-08-20 18:01 評(píng)論0 收藏0
JS對(duì)象繼承與原型鏈

摘要：此用來(lái)定義通過(guò)構(gòu)造器構(gòu)造出來(lái)的對(duì)象的原型，構(gòu)造器內(nèi)部的代碼用來(lái)給對(duì)象初始化。對(duì)象繼承 VS 類(lèi)繼承在 class-based 的面向?qū)ο蟮氖澜缋?，要出現(xiàn)對(duì)象，必須先有類(lèi)。類(lèi)之間可以繼承，類(lèi)再使用 new 操作創(chuàng)建出實(shí)體，父子對(duì)象之間的繼承體現(xiàn)在父類(lèi)和子類(lèi)上。你不能說(shuō) 對(duì)象 a 繼承了對(duì)象 b，只能說(shuō) class A 繼承了 class B，然后他們各自有一個(gè)實(shí)例a、b。 JS中實(shí)現(xiàn)...

QLQ 2019-08-22 11:08 評(píng)論0 收藏0
JavaScript之深入各種繼承

摘要：通常有這兩種繼承方式接口繼承和實(shí)現(xiàn)繼承。理解繼承的工作是通過(guò)調(diào)用函數(shù)實(shí)現(xiàn)的，所以是寄生，將繼承工作寄托給別人做，自己只是做增強(qiáng)工作。適用基于某個(gè)對(duì)象或某些信息來(lái)創(chuàng)建對(duì)象，而不考慮自定義類(lèi)型和構(gòu)造函數(shù)。一、繼承的概念繼承，是面向?qū)ο笳Z(yǔ)言的一個(gè)重要概念。通常有這兩種繼承方式：接口繼承和實(shí)現(xiàn)繼承。接口繼承只繼承方法簽名，而實(shí)現(xiàn)繼承則繼承實(shí)際的方法。《JS高程》里提到：由于函數(shù)沒(méi)有簽名，...

tomlingtm 2019-08-23 17:08 評(píng)論0 收藏0
JS中繼承方式總結(jié)

摘要：三組合繼承結(jié)合原型鏈方式和借用構(gòu)造函數(shù)方式的有點(diǎn)，進(jìn)行改進(jìn)的一種繼承方式。四寄生組合式繼承為了解決組合繼承中子構(gòu)造函數(shù)的原型鏈出現(xiàn)冗余的屬性和方法，引入的一種繼承方式。說(shuō)在前面：為了使代碼更為簡(jiǎn)潔方便理解，本文中的代碼均將非核心實(shí)現(xiàn)部分的代碼移出。一、原型鏈方式關(guān)于原型鏈，可點(diǎn)擊《深入淺出，JS原型鏈的工作原理》，本文不再重復(fù)敘述。思路：讓子構(gòu)造函數(shù)的原型等于父構(gòu)造函數(shù)的實(shí)例...

rottengeek 2019-08-26 13:27 評(píng)論0 收藏0