原型链继承
让父类中的属性和方法在子类实例的原型上
function A(x){
this.x = x;
}
A.prototype.getX = function(){
console.log(this.x);
}
function B(y){
this.y = y;
}
B.prototype = new A(); //原型链继承的核心
B.prototype.constructor = B; //B.prototype重定向之后,没有了constructor这个函数,需要我们手动去添加一个,才能确保原型链的完整性
B.prototype.getY = function(){
console.log(this.y);
}
特点:
- 它是重定向了子类的原型对象,让子类的prototype指向父类的实例,实例想要调取这些方法,是基于_proto_原型链查找机制完成的
- 子类可以重写父类上的方法
- 父类中的私有或者公有的属性方法,最后都会变为子类中的公有的属性和方法
call继承
子类方法中把父类当做普通函数执行,让父类中的this指向子类的实例,相当于给子类的实例设置了很多私有的属性或方法
function A(x){
this.x = x;
}
A.prototype.getX = function(){
console.log(this.x);
}
function B(y){
A.call(this,100); //等价于 b1.x=100;
this.y = y;
}
B.prototype.getY = function(){
console.log(this.y);
}
let b1 = new B(200)
特点:
- 只能继承父类私有的属性或方法
- 父类私有的变成子类私有的
寄生组合继承
call继承 + 类似于原型继承
特点:父类私有和公有的属性方法分别是子类实例的私有和公有属性方法
function A(x){
this.x = x;
}
A.prototype.getX = function(){
console.log(this.x);
}
function B(y){
A.call(this,100);
this.y = y;
}
//Object.create(OBJ): 创建一个空对象,让空对象._proto_指向OBJ
B.prototype = Object.create(A.prototype);
B.prototype.constructor = B;
B.prototype.getY = function(){
console.log(this.y)
}
关于在IE浏览器下是不能使用_proto_的 Object.create的处理
//正常的Object.create的写法
object.create = function(obj){
let oo = {};
oo._proto_ = obj;
return oo;
}
//在IE浏览器下的写法
object.create = function(obj){
function Fn(){}
Fn.prototype = object;
return new Fn();
}
ES6中的继承
class child extends parent{}
class A{
constructor(x){
this.x = x;
}
getX(){
console.log(this.x);
}
}
class B extends A{
constructor(y){
//子类只要继承父类,可以不写constructor,一旦写了,则在constructor中的第一句必须是super(),否则会报错
/*不写constructor浏览器会自己默认创建
constructor(...args){
super(...arg);
}
*/
super(100); //相当于A.call(this,100)
this.y = y;
}
getY(){
console.log(this,y);
}
}