更新時間:2021-12-15 來源:黑馬程序員 瀏覽量:
在ES6之前,JavaScript中并沒有extends繼承,如果要實現(xiàn)繼承的效果,可以通過構(gòu)造函數(shù)和原型對象來模擬實現(xiàn)。本節(jié)將會講解如何利用構(gòu)造函數(shù)和原型對象實現(xiàn)繼承。
在ES6中,繼承是通過定義兩個類,然后子類用extends關(guān)鍵字繼承父類。而在ES
6之前,只能用構(gòu)造函數(shù)來代替類,在子類中利用call0方法將父類的this指向子類的this,這樣就可以實現(xiàn)子類繼承父類的屬性。為了使讀者更好地理解,下面我們通過代碼進行演示。
如果沒有,再到Son原型對象中查找,如果仍然沒有,再到Father原型對象中查找,一沿著原型鏈找到最后。由于Father原型對象中有一個money()方法,所以通過Son實例對象就繼承了money()方法。
不能直接將父類原型對象賦值給子類原型對象,這樣會導(dǎo)致子類無法擁有自己的方法,在子類中添加的方法同時也會添加到父類中。下面我們通過代碼演示這樣一種錯誤的用法。
function Father() {} Father.prototype.money = function() { console.log(100000), }; function Son() {} Son.prototype = Father.prototype; //通過這種方式無法實現(xiàn)真正的繼承 Son.prototype.exam = function() {}; //為子類增加方法的時候,會影響父類 console.log(Father.prototype.exam); //可以看到父類也有了exam方法真正的繼承是子類可以擁有自己的方法,并且當子類和父類的方法名相同時,子類方法可以覆蓋父類方法。
多學(xué)一招:class語法的本質(zhì)
ES
6提供了class語法用來定義類,但即使沒有class語法,在JavaScript中可以用構(gòu)造函數(shù)和原型對象的語法來替代。那么,class語法定義的類和構(gòu)造函數(shù)有沒有區(qū)別呢?下面我們通過代碼進行測試。
class Person {} console.log(Person.prototype); //類也有原型對象 Person.prototype.money = function() { //類也可以增加方法 console.log(100000); }; new Person().money(); //輸出結(jié)果:100000
ES6 的 class 和構(gòu)造函數(shù)的區(qū)別
【AI設(shè)計】北京143期畢業(yè)僅36天,全員拿下高薪offer!黑馬AI設(shè)計連續(xù)6期100%高薪就業(yè)
2025-09-19【跨境電商運營】深圳跨境電商運營畢業(yè)22個工作日,就業(yè)率91%+,最高薪資達13500元
2025-09-19【AI運維】鄭州運維1期就業(yè)班,畢業(yè)14個工作日,班級93%同學(xué)已拿到Offer, 一線均薪資 1W+
2025-09-19【AI鴻蒙開發(fā)】上海校區(qū)AI鴻蒙開發(fā)4期5期,距離畢業(yè)21天,就業(yè)率91%,平均薪資14046元
2025-09-19【AI大模型開發(fā)-Python】畢業(yè)33個工作日,就業(yè)率已達到94.55%,班均薪資20763元
2025-09-19【AI智能應(yīng)用開發(fā)-Java】畢業(yè)當天offer率91%,薪資1W+占比54.2%,班級均薪12k+
2025-09-19