javascript中实现继承的三种方式(一看就懂)

1、原型继承

 	//  父类 
        function Persion(name,age){ 
        	this.name = name; 
        	this.age = age; 
        }
        // 父类的原型对象属性 
        Persion.prototype.id = 10;
        // 子类 
        function Boy(sex){ 
        	this.sex = sex;
        }
        // 继承实现 
        Boy.prototype = new Persion('c5',27);
         var b = new Boy(); 
         alert(b.name)// c5 
         alert(b.id)//10

这种原型继承的特点:既继承了父类的模板,又继承了父类的原型对象。优点是 继承了父类的模板,又继承了父类的原型对象,缺点就是父类实例传参,不是子类实例化传参,不符合常规语言的写法。

2、类继承(借用构造函数的方式继承)

        //  父类 
        function Persion(name,age){ 
        	this.name = name; 
        	this.age = age; 
        }
        // 父类的原型对象属性 
        Persion.prototype.id = 10;
        // 子类 
        function Boy(name,age,sex){ 
        	//call apply 实现继承
        	Persion.call(this,name,age);
        	this.sex = sex;
        }
         var b = new Boy('c5',27,'男'); 
         alert(b.name)// c5 
         alert(b.id)//undinfind 父类的原型对象并没有继承


这种原型继承的特点:继承了父类的模板,不继承了父类的原型对象。优点是方便了子类实例传参,缺点就是不继承了父类的原型对象


3、混合继承(原型继承和类继承)

 	//  父类 
        function Persion(name,age){ 
        	this.name = name; 
        	this.age = age; 
        }
        // 父类的原型对象属性 
        Persion.prototype.id = 10;
        // 子类 
        function Boy(name,age,sex){ 
        	//call apply 实现继承
        	Persion.call(this,name,age);
        	this.sex = sex;
        }
        // 原型继承实现  参数为空 代表 父类的实例和父类的原型对象的关系了
	 Boy.prototype = new Persion();
         var b = new Boy('c5',27,'男'); 
         alert(b.name)// c5 
         alert(b.id)//10

这种原型继承的特点:既继承了父类的模板,又继承了父类的原型对象。优点方便了子类实例传参,缺点就是Boy.pertotype = new Persion()  函数又实例一次,函数内部变量又重复实例一次,大程序时候会很好性能。



  • 7
    点赞
  • 56
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值