JS的继承方式

  • 原型链继承

    function Parent() {
    	this.familyName = '张';
    }
    Parent.prototype.getLanguage = function() {
    	return 'chinese';
    }
    function Child(age, gender) {
    	this.age = age || 0;
    	this.gender = gender || '未知';
    }
    Child.prototype = new Parent();
    let daughter = new Child(2, '女');
    let son = new Child(10, '男');
    //daughter: {age: 2, gender: '女'}  daughter.getLanguage(): 'chinese' daughter.familyName: '张'
    //son: {age: 10, gender: '男'} son.getLanguage(): 'chinese' son.familyName: '张'
    

    缺点:原型被所有子类的实例共享,一个子类更改原型上的属性,会同时更改其他子类的属性(所有子类公用是同一个对象);子类拥有父类实例的属性和方法。

  • 经典继承(构造方法继承)
    在子类的构造函数中使用call()或者apply()调用父类构造函数

    function Parent(age, gender) {
    	this.familyName = '王';
    	this.age = age || 0;
    	this.gender = gender || '未知';
    }
    Parent.prototype.getLanguage = function() {
    	return 'chinese';
    }
    function Child(age, gender){
    	Parent.call(this, age, gender);
    }
    let daughter = new Child(2, '女');
    let son = new Child(10, '男');
    

    缺点:子类不是父类的实例,只是借用了父类的构造函数,给自己赋值;不能继承父类原型链。

  • 组合继承:原型链继承+经典继承

    function Parent(age, gender) {
    	this.age = age || 0;
    	this.gender = gender || '未知';	
    	this.familyName = '李';//父类实例才有的属性
    }
    Parent.prototype.getLanguage = function () {
    	return 'chinese';
    }
    function Child(age, gender) {
    	Parent.call(this, age, gender);
    }
    Child.prototype = new Parent();
    Child.prototype.constructor = Child;
    let son = new Child(10, '男');
    

    特点:结合原型式继承和构造函数继承
    缺点:子类具有父类实例的属性和方法(son.familyName:‘李’ )。

  • 原型式继承

    const parent = {
    	familyName: '赵',
    	member: [],
    }
    const child1 = Object.create(parent);
    child1.member.push(child1);
    const child2 = Object.create(parent);
    child2.member.push(child2);
    //child2.member: [child1, child2]; child1.__proto__ === child2.__proto__
    

    let child = Object.create(parent)相当于创建一个child对象,并把这个child对象的原型(__proto__)指向parent。(child.__proto__=parent
    缺点:所有子类实例共享parent,一个子类实例更改parent属性,其他的也会改变。

  • 寄生式继承(跟原型继承相似,可以给新创建的对象添加额外的属性和方法)

    function factoryFun(obj) {
    	let newObj = Object.create(obj);
    	newObj.getLanguage = function () {
    		return 'chinese';
    	}
    	return newObj;
    }
    

    缺点:每次创建对象都会创建一遍方法。

  • 寄生组合式继承(最完美的方式)

    function Parent(age, gender) {
    	this.age = age || 0;
    	this.gender = gender || '未知';
    	this.familyName = '钱';
    }
    function Child(age, gender) {
    	Parent.call(age, gender);
    }
    Child.prototype = Object.create(Parent.prototype);
    Child.prototype.constructor = Child;
    
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值