浅谈js中的继承===中篇

我们在上一次说到类式继承,接着往下说来

// 类式继承
		function SuperClass(){
			this.superValue=true;
		}
		//为父类添加共有的方法
		SuperClass.prototype.getSuperValue=function(){
			return this.superValue;
		}
		//声明子类
		function SubClass(){
			this.subValue=false;
		}
		//继承父类
		SubClass.prototype=new SuperClass();
		//为子类添加共有的方法
		SubClass.prototype.getSubValue=function(){
			return this.subValue;
		}
		var child=new SubClass();
		console.log(child.subValue,child.superValue)

上面是上次我说的类式的继承
类式继承主要是通过子类的原型对象是父类的实例化对象来实现
子类对父类的继承
这里说一下new 关键字的作用就是讲对象内部不停的赋值给前面的那个实例化对象本质上算是产生一个父类的副本算是吧。
我们用子类的实例

var instance =new SubClass();
console.log(instance.getSuperValue)// 输出 true
console.log(instance.getSubValue) // 输出 false

可能有的童鞋可能会验证了 instance 是否是子类的实例化对象了
这个我们可以通过insanceof 来验证
instanceof 就是验证前面的对象是否属于后面对象的实例的

console.log(instance instanceof SuperClass)  // true
console.log(instance instanceof SubClass)   // true
console.log(SubClass instanceof SuperClass)  //false

可能在这里就会发现问题了
子类的实例 instance 确实属于 SuperClass和SubClass的原型链上的
但是 SubClass 却不是 SuperClass
我们说 SubClass 继承了 SuperClass 可是为什么打印出来的是false呢
这个其实也不奇怪因为我们用的是
子类的原型继承了父类的实例化对象我们再次验证一下

console.log(SubClass.prototype instanceof SuperClass)  // true

这个算是类式继承的一个特点吧
在js中有一个祖先对象Object 所有的对象原型链的终点可能找到 Object对象

console.log(instance instanceof Object) // true

让然了类式继承还有一个缺点
聪明的童鞋可能已经隐约猜到了
我们子类的原型继承是父类的实例那么会导致另一个结果就是
父类中的共有类型是引用类型的话这样就是会被所有子类所共有。
换句人话就是说: 引用类型数据一个子类实例修改会导致另一个实例中的数据也会发生变化。
上面说的可能有点晦涩难懂
我们还是直接举例子说明吧

function SuperClass(){
	this.list=[1,2,3,4,5];
}
function SubClass(){};
SubClass.prototype=new SuperClass();
var a=new SubClass();
var b=new SubClass();
console.log(a.list)//  [1,2,3,4,5];
b.list.push(6);  // 修改b实例中的 数据
console.log(a.list) // [1,2,3,4,5,6];

可以看出 b中数据的修改也导致了 a中的数据发生了变化
虽然可能b也是无意修改的但这样导致a中的数据发生变化显然不是我们想要的那种的效果。
而且这只是类式继承的缺点之一
类式继承的还有一个问题就是
子类继承父类是通过原型对象继承父类的实例化对象由来的
这样做让我们无法将父元素中的数据进行初始化操作
往往都是父类中数据进行定死操作 ,这个也显然不是我们想要的。
那我们该怎么解决这些问题呢。未完待续
生活那么苦,那就笑着去面对,记得给自己吃颗糖！！！

yunchong_zhao

发布了236 篇原创文章 · 获赞 80 · 访问量 2万+

私信关注

浅谈js中的继承===中篇

猜你喜欢