首页 > 代码库 > JS原型和继承
JS原型和继承
//Js所有的函数都有一个prototype属性 function aa() { } console.info(aa.prototype); //这个prototype属性引用了一个对象,即原型,初始化时是一个空对象,也就是没有一个成员(即原型属性和原型方法)。 var i = 0; for (i in aa.prototype) { console.info(i); i++; } alert("member: " + i);//alert出原型所有属性和方法个数。 0个属性和方法 function AA() { } AA.prototype.name = ‘leyi‘; AA.prototype.fn = function () { return ‘hello world!‘ }; var bb = new AA(); //实例化对象没有原型对象,他可以通过__proto__来取得原型链上的原型属性和原型方法 console.info(bb.prototype)//undefined console.info(bb.__proto__) //指向AA.prototype //那么获取bb的属性和方法就可以通过原型链获取AA原型上的方法属性 console.info(bb.name === bb.__proto__.name);//leyi console.info(bb.fn() === bb.__proto__.fn());//hello world! //bb的的构造器函数就是AA.prototype.constructor console.info(bb.constructor === AA.prototype.constructor)//true //bb的的构造器函数的原型就是AA.prototype console.info(bb.constructor.prototype === AA.prototype)//true //继承 //一、通过对象冒充实现继承 function X(width, height) { this.width = width; this.height = height; } function Y(w, h) { this.fn = X;//让父类的构造函数成为子类的方法 this.fn(w, h);//执行该方法,继承了X方法的width,height属性 delete this.fn; //删掉该方法 this.draw = function () { console.info(this.width + ‘---‘ + this.height);//打印继承来的两个属性 } } new Y(100, 200).draw();//100---200 //二、通过call apply实现继承,原理跟上面差不多 function XX(width, height) { this.width = width; this.height = height; } function YY(w, h) { XX.call(this, w, h);//or XX.apply(this,[w,h]); this.draw = function () { console.info(this.width + ‘---‘ + this.height);//打印继承来的两个属性 } } new YY(300, 400).draw();//300---400 //三、通过原型链实现继承 function XXX(width, height) { this.fn = function () { console.info(‘haha‘) } } function YYY() { this.draw = function () { this.fn(); } } YYY.prototype = new XXX(); var yyy = new YYY() console.info(yyy.constructor)//这里有点小问题,yyy构造器函数指向了XXX //YYY.prototype是YYY的原型,yyy.constructor.prototype是XXX的原型 console.info(yyy.constructor.prototype === YYY.prototype)//false //修正指向 YYY.prototype.constructor = YYY//将YYY原型的构造器设置指向为YYY构造函数 console.info(yyy.constructor.prototype === YYY.prototype)//true console.info(yyy.constructor)//YYY yyy.draw(); //混合式继承 function XXXX(width, height) { this.width = width; this.height = height; } XXXX.prototype.halo = ‘halo!‘ function YYYY(w, h) { XXXX.call(this, w, h); this.draw = function () { console.info(this.width + ‘---‘ + this.height); } } YYYY.prototype = new XXXX(); YYYY.prototype.constructor = YYYY; new YYYY(666, 666).draw();//666---666 console.info(new YYYY().halo)//halo! var cst = new YYYY() console.info(cst.constructor.prototype === YYYY.prototype)//true console.info(cst.constructor)//YYYY
参考:
http://www.cnblogs.com/ljchow/archive/2010/06/08/1753526.html
http://javapolo.iteye.com/blog/1996871
JS原型和继承
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。