首頁 > web前端 > js教程 > 主體

ES6中class與js prototype原型繼承的關係

小云云
發布: 2018-03-07 15:27:56
原創
1359 人瀏覽過

ES6為了進一步的縮減程式碼的編寫,和簡化程式碼的邏輯,引入了關鍵字 class。但class的實作也是在prototype的基礎上,做了一層語法糖,它的絕大部分功能,ES5 都可以做到,新的class寫法只是讓物件原型的寫法更加清晰、更像物件導向程式設計的文法而已。

class Person {
constructor(name) {
this.name=name||"Default";
}
toString(){
return 'Name:'+this.name;
}
}
var p1=new Person();
console.log(p1.name);
class Boy extends Person{
constructor(name){
super(name);
this.gende='Boy';
}
toString(){
return super.toString()+" - Gende:"+this.gende;
}
}
var b1=new Boy('hello');
console.log(b1);
console.log(b1.toString());
登入後複製

ES5的繼承,也就是prototype
實質是先創造子類別的實例物件this
然後再將父類別的方法加入this上面(Parent. apply(this))
ES6的繼承,也就是class
實質是先創造父類別的實例物件this(必須先呼叫super)
然後再用子類別的建構子修改this
它們的實作機制是不同的
ES6與ES5 一樣,類別的所有實例共用一個原型物件

#對於es6這一塊,還是很有必要去讀一讀文檔的。

相關推薦:

ES6中class關鍵字詳解

#ES6 javascript中class類別的get與set用法實例

js的Prototype屬性用法詳解

#

以上是ES6中class與js prototype原型繼承的關係的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!