码迷,mamicode.com
首页 > Web开发 > 详细

聊一聊JS的继承

时间:2018-02-08 13:45:47      阅读:168      评论:0      收藏:0      [点我收藏+]

标签:将实例   tom   修复   nim   构造函数   父类   super   组合   cat   

1、组合继承

//		组合继承
		function Animal(){
			this.name=name||‘Animal‘;
			this.sleep=function(){
				console.log(this.name+‘sleep‘);
			}
		}
		Animal.prototype.eat=function(food){
			console.log(this.name+‘eat‘+food);
		}
		
		function Cat(name){
			Animal.call(this);//继承实例属性/方法,也可以继承原型属性/方法
			this.name=name||‘tom‘;//调用了两次父类构造函数,生成了两份实例(子类实例将子类原型上的那份屏蔽了)
		}
		Cat.prototype=new Animal();
		Cat.prototype.constructor=Cat;//组合继承也是需要修复构造函数指向的。
		var cat = new Cat();//既是子类的实例,也是父类的实例
		console.log(Cat.prototype.constructor);
		console.log(cat.name)
		console.log(cat.eat(‘haha‘))//可传参

  

特点:

 可以继承实例属性/方法,也可以继承原型属性/方法

  1. 既是子类的实例,也是父类的实例
  2. 不存在引用属性共享问题
  3. 可传参
  4. 函数可复用

缺点:

  1. 调用了两次父类构造函数,生成了两份实例(子类实例将子类原型上的那份屏蔽了)

推荐指数:★★★★(仅仅多消耗了一点内存)

 

2、寄生组合继承

寄生组合继承
		function Animal(){
			this.name=name||‘Animal‘;
			this.sleep=function(){
				console.log(this.name+‘sleep‘);
			}
		}
		Animal.prototype.eat=function(food){
			console.log(this.name+‘eat‘+food);
		}
		
		function Cat(name){
			Animal.call(this);
			this.name=name||‘tom‘;
		}
		
		(function(){
			var Super=function(){};// 创建一个没有实例方法的类
			Super.prototype=Animal.prototype;
			Cat.prototype=new Super(); //将实例作为子类的原型
		})()
		Cat.prototype.constructor = Cat;
		var cat=new Cat();
		console.log(cat.eat(‘haha‘))

  

特点:

  1. 堪称完美

缺点:

  1. 实现较为复杂

推荐指数:★★★★(实现复杂,扣掉一颗星)

聊一聊JS的继承

标签:将实例   tom   修复   nim   构造函数   父类   super   组合   cat   

原文地址:https://www.cnblogs.com/yiyi17/p/8430827.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!