ES5的繼承和ES6繼承的區別

2021-10-09 02:27:21 字數 1280 閱讀 8136

es5繼承

基本思想:利用原型鏈讓乙個引用型別繼承另乙個引用型別的屬性和方法(即通過prototype和建構函式實現)

實質:將父類新增到子類的原型鏈上去

es6繼承:

基本思想:通過extend關鍵字實現繼承,子類可以繼承父類中所有的方法和屬性,子類必須在construc()方法中呼叫super()方法,因為新建的子類沒有自己的this物件,而是繼承了父類的this物件;

實質:利用extend關鍵字繼承父類,然後繼承父類的屬性和方法

使用:解決**的復用

使用extends關鍵字實現繼承

子類可以繼承父類中所有的方法和屬性

子類只能繼承乙個父類(單繼承),乙個父類可以有多個子類

子類的構造方法中必須有super()來指定呼叫父類的構造方法,並且位於子類構造方法中的第一行

子類中如果有與父類相同的方法和屬性,將會優先使用子類的(覆蓋)

es6繼承eg

在這裡插class people 

//原型方法

eat()

//靜態方法

static play()

}class student extends people

study()

}let stu = new student();

console.log(stu.a, stu.b);

stu.eat();

stu.study();

student.play();入**片

es5繼承eg

//原型鏈: child -> new parent() -> new grandparent() -> new object();

function grandparent()

parent.prototype = new grandparent();

function parent()

child.prototype = new parent();

function child()

var child = new child();

console.log(child); // child

console.log(child.a); // 3

console.log(child.b); //2

console.log(child.c); //1

ES5和ES6的繼承

在es6之前,js的函式和物件是混在一起的,通過new呼叫函式,就是把函式當作物件,建立例項。funciton person name,age person.prototype.getname function person.prototype.setname function name var p...

ES5和ES6的繼承

建構函式 function obj uname,age 建立例項物件 var test newobj uname 18 使用方法 test.method obj.boy 建構函式名字的首字母要大寫,且與new一起使用 建構函式中的屬性方法被叫做成員。其中 1 靜態成員 在建構函式本身上新增的成員,如...

ES5和ES6的繼承

es5繼承 建構函式 原型和例項的關係 每乙個建構函式都有乙個原型物件,每乙個原型物件都有乙個指向建構函式的指標,而每乙個例項都包含乙個指向原型物件的內部指標,1 function supertype 4 supertype.prototype.getsupervalue function 7 fu...