javascript原型继承学习笔记
1.定义一个父类
?
var superClass = function(){ this.superPro = 'super'; }superClass.prototype.pubPro = 'pubPro'; //定义父类公有属性(函数)?
2.定义一个子类??
?
var subClass = function(){ this.subPro = 'sub';}? ?
3.通过prototype类型属性实现继承
?? 3.1 子类prototype直接指向父类prototype?
subClass.prototype = superClass.prototype; var subObj = new subClass(); alert(subObj.pubPro); //输出 pubPro?
???? 注:这种方法存在一个弊端,由于javascript 中对象赋值是引用赋值方式.
?????? ?会导致子类中的对prototype修改引起所有继承superClass的子类发生变化.
??????? 我们看下一下代码就会发现:
???????
subClass.prototype.pubPro = 'subPro';//修改子类的原型属性值 var superObj = new superClass(); //获取父类对象实例 alert(superObj.pubPro); // 这里输出 subPro
?
?? 3.2 子类prototype直接指向父类实例
??????? 为了解决3.1中的弊端,我们可以给子类的prototype引用指定父类的对象实例.代码如下:
?
subClass.prototype = new superClass(); var subObj = new subClass(); alert(subObj.pubPro); // 这里输出 subPro
?
??? 注：这种方式同样存在一个问题,父类中的函数中定义的(非原型)中定义的属性(函数),将被继承到子类中.这样是不符合利用prototype属性实现的规则（要求继承的属性函数都在prototype中定义）.所以有3.3中的方法.
??? 3.3?利用空函数传递prototype
???????
function F(){};F.prototype = superClass.prototype; //空行数F原型指向父类原型subClass.prototype = new F();alert(subObj.superPro); //输出undefined, superPro是函数体内定义的,不应该被继承. alert(subObj.pubPro); //输出 pubPro , pubPro 是原型 prototype 中定义的,将被继承.?
?4.继承后指定构造函数.
???? 利用prototype属性实现继承后,会造成子类的构造函数被指向到父类的构造函数.所以在指定prototype属性后,还需还原子类的构造函数.代码参考如下:
?
subClass.prototype.constructor = subClass;
?
5.封装方法
?
//公共方法函数function extendFun(subClass,superClass){if (typeof superClass!= 'function') return subClass;//保存对父类的引用 subClass.base = superClass.prototype; subClass.base.constructor = superClass;//这里保存一下父类的构造函数,以便利用 //继承 var f = function () { }; f.prototype = superClass.prototype; subClass.prototype = new f(); subClass.prototype.constructor = subClass;//指定子类构造函数}?
//封装到js对象中Function.prototype.extendFun = function (superClass){if (typeof superClass != 'function') return this;//保存对父类的引用 this.base = superClass.prototype; this.base.constructor = superClass;//这里保存一下父类的构造函数,以便利用 //继承 var f = function () { }; f.prototype = superClass.prototype; this.prototype = new f(); this.prototype.constructor = subClass;//指定子类构造函数}?
?
?
?
?
?
?
?