成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

【js】what is 繼承

0xE7A38A / 2545人閱讀

摘要：如果請(qǐng)求出錯(cuò)需要捕捉錯(cuò)誤，還可以根據(jù)后端返回的狀態(tài)碼統(tǒng)一判斷請(qǐng)求是否成功。如果把這些共同點(diǎn)封裝成一個(gè)，而每一個(gè)頁(yè)面都繼承了這個(gè)類就可以大大的提高開發(fā)效率。原型鏈提到繼承，不得不說(shuō)原型鏈。原型鏈繼承繼承提供了這個(gè)，可以更簡(jiǎn)單的實(shí)現(xiàn)繼承

應(yīng)用場(chǎng)景
例如在前端開發(fā)中，幾乎每一個(gè)頁(yè)面都有http請(qǐng)求，請(qǐng)求前都要顯示loading，請(qǐng)求完成后loading要顯示。如果請(qǐng)求出錯(cuò)需要捕捉錯(cuò)誤，還可以根據(jù)后端返回的狀態(tài)碼統(tǒng)一判斷請(qǐng)求是否成功。
如果把這些共同點(diǎn)封裝成一個(gè)http，而每一個(gè)頁(yè)面都繼承了這個(gè)類就可以大大的提高開發(fā)效率。

原型鏈
提到繼承，不得不說(shuō)原型鏈。
在JavaScript中所有的類型都繼承自O(shè)bject。也許有人會(huì)有疑問(wèn)，你怎么證實(shí)這一點(diǎn)呢？

let str = "hello"
str.toString() // hello

str 明明是一個(gè)基本類型，為什么可以調(diào)用方法呢？
通過(guò)瀏覽器打印str.__proto__ 發(fā)現(xiàn)這個(gè)屬性指向String類型的prototype;
再打印String.prototype的__proto__ 發(fā)現(xiàn)它執(zhí)行Object的prototype;
也就等于 str ---> str.__proto --> str.__proto__.__proto__(也就是String) ---> Object.prototype

str.__proto__ === String.prototype //true
String.prototype.__proto__ === Object.prototype  //true

每一個(gè)對(duì)象的__proto__指向它的構(gòu)造函數(shù)的原型對(duì)象
每一個(gè)構(gòu)造函數(shù)的prototype指向它的原型對(duì)象
當(dāng)str通過(guò)這樣鏈?zhǔn)降牟檎艺{(diào)用了Object里的.toString()方法，這就是繼承的體現(xiàn)。

原型鏈繼承

function Parent(addr){
    this.addr = addr
}
Parent.prototype = {
    getAddr(){
        return this.addr
    }
}
function Child(addr){
    Parent.call(this,addr)
}
Child.prototype = Object.create(Parent.prototype,{
    constructor:{
        value: Child,
        enumerable: false,
        writable: true,
        configurable:true
    }
})
let baby = new Child("mzdd")
baby.getAddr() // mzdd

Class繼承
ES6提供了Class這個(gè)API，可以更簡(jiǎn)單的實(shí)現(xiàn)繼承

Class Parent {
    constructor(addr) {
        this.addr = addr
    }
    getAddr() {
        return this.addr
    }
}
Class Child extends Parent {
    constructor(addr) {
        super(addr)
    }
}

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

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

相關(guān)文章

  • klass 是如何實(shí)現(xiàn)JS的類以及類的相關(guān)屬性和作用

    摘要：前面介紹了和是如何實(shí)現(xiàn)類，及其類的屬性和作用的。今天介紹的就是單純的實(shí)現(xiàn)面向?qū)ο蟮膸?kù)，只有多行，也照例分析吧。 前面介紹了prototype.js和Mootools.js是如何實(shí)現(xiàn)類，及其類的屬性和作用的。今天介紹的klass.js就是單純的實(shí)現(xiàn)面向?qū)ο蟮膸?kù)，只有90多行，也照例分析吧。 實(shí)現(xiàn)類的步驟 第一步是使用klass新建類，初始化的固定函數(shù)是initialize，不能使用其它...

    Kross 評(píng)論0 收藏0

  • js實(shí)現(xiàn)繼承的方法中為何總是要修正constructor方法的指向呢？

    摘要：由于屬性是可以變更的，所以未必真的指向?qū)ο蟮臉?gòu)造函數(shù)，只是一個(gè)提示。不過(guò)，從編程習(xí)慣上，我們應(yīng)該盡量讓對(duì)象的指向其構(gòu)造函數(shù)，以維持這個(gè)慣例。 問(wèn)題引入 最近看了許多關(guān)于js繼承實(shí)現(xiàn)的相關(guān)文章，許多實(shí)現(xiàn)方式中都會(huì)存在這么一行代碼： A.prototype.constructor = A 于是感到好奇，這行代碼的實(shí)際意義是什么？如果沒(méi)有的話，還能達(dá)到繼承的目的嗎？ 前置知識(shí) 為了熟悉jav...

    fancyLuo 評(píng)論0 收藏0

  • JavaScript選擇題解答（1-20）

    摘要：最近做了個(gè)上的的測(cè)試題目地址，錯(cuò)了一大堆，感覺(jué)的概念還有很多不是很清晰，這里記錄一下個(gè)人博客文章地址第一題解答這里考的是的用法。如果出現(xiàn)的數(shù)字不符合后面輸入的進(jìn)制，則為，所以第二個(gè)值為。 最近做了個(gè)heroku上的JavaScript的測(cè)試（題目地址），錯(cuò)了一大堆，感覺(jué)js的概念還有很多不是很清晰，這里記錄一下 個(gè)人博客文章地址 第一題 What is the result of...

    Worktile 評(píng)論0 收藏0

  • ES6 入坑筆記：說(shuō)說(shuō)一些新概念

    摘要：雖然現(xiàn)在還需要借助的力量但未來(lái)一定是屬于。將類引入了，大大簡(jiǎn)化了原先復(fù)雜的工作從前要實(shí)現(xiàn)繼承得多麻煩工廠模式無(wú)法解決對(duì)象識(shí)別，構(gòu)造函數(shù)模式內(nèi)存浪費(fèi)，原型模式私有方法還要結(jié)合構(gòu)造模式定義實(shí)例實(shí)現(xiàn)類的繼承，我要用到繼承類可以重寫父類的方法 雖然現(xiàn)在還需要借助babel的力量但未來(lái)一定是屬于ES6。（那ES7？-_-|||） let 在ES6之前javascript只有兩種作用域，即全局作用...

    scq000 評(píng)論0 收藏0

  • JS學(xué)習(xí)筆記 - 代碼復(fù)用

    摘要：本文章記錄本人在學(xué)習(xí)中看書理解到的一些東西，加深記憶和并且整理記錄下來(lái)，方便之后的復(fù)習(xí)。但是在開發(fā)的過(guò)程中，并不是所有的代碼復(fù)用都會(huì)使用到繼承。而且整個(gè)代碼都無(wú)法按照預(yù)期來(lái)運(yùn)行。為了修復(fù)綁定對(duì)象與方法之間的關(guān)系。 本文章記錄本人在學(xué)習(xí) JavaScript 中看書理解到的一些東西，加深記憶和并且整理記錄下來(lái)，方便之后的復(fù)習(xí)。 js 中復(fù)用代碼 說(shuō)道代碼復(fù)用，一般都會(huì)涉及到對(duì)...

    cheng10 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<