js中的继承
定义
什么是继承?
通过某种方式,让一个对象可以访问到另一个对象中的属性和方法叫做继承
或者说子类去继承父类的公有属性和私有属性
继承的应用
为什么要使用继承?
代码或功能可以重复使用,节省内存空间,简化代码。
继承的分类
原型继承
让子类的原型指向父类的对象 Child.prototype = new Parent;
代码如下:
function Parent() { // 父类
this.x = 100;
}
Parent.prototype.getX = function () {
return this.x;
}
function Child() { // 子类
this.y = 200;
}
Child.prototype = new Parent; // 让子类的原型指向父类对象
Child.prototype.getY = function () {
return this.y;
}
var c1 = new Child();
console.log(c1.x); // 100 x是继承父的x
console.log(c1.getX()); // 100 getX是继承父的getX
特点:即继承了父类的私有属性也继承了父类的公有属性
call继承
Parent.call(this);
代码如下:
function Parent() { // 父类
this.x = 100;
}
Parent.prototype.getX = function () { // 子类
return this.x;
}
function Child() {
Parent.call(this); // 让parent中的this指向一个空对象,并且执行
this.y = 200;
}
var c1 = new Child();
console.log(c1.x); // 100
特点:只能继承父类的私有属性
组合继承
1.Parent.call(this); // 继承父的私有属性
2.Child.prototype = Object.create(Parent.prototype); 子类继承父类的公有属性
代码如下:
function Parent() { // 父类
this.x = 100;
}
Parent.prototype.getX = function () { // 子类
return this.x;
}
function Child() {
Parent.call(this); // 继承父的私有属性
this.y = 200;
}
// 为了不影响父类的原型对象 copy一份赋值给了Child.prototype
Child.prototype = Object.create(Parent.prototype);
// 最好手动的修改一个Child原型对象上constructor指向
Child.prototype.constructor = Child; // 手动修改constructor的指向,保证类的完整性
var c = new Child();
console.log(c.x);
console.log(c.getX())
ES6中的继承
1, super(); 类似于之前的call继承 继承父类的私有属性
2,extends 类似于原型对象 继承公有属性
两个需要一起写
class Parent{
constructor() {
this.x = 100;
}
getX(){
return this.x;
}
}
class Child extends Parent{
constructor() {
super();
this.y = 200;
}
getY(){
return this.y
}
}
var child = new Child();
console.log(child.x); // 100
console.log(child.getX()); // 100