Javascript实现完美继承
标签:
JavaScript
javascipt
实现javascript完美继承要考虑三个方面:
第一步: 获取父构造函数体内的属性
解决方法: 通过
Father.call(this)
实现(这里的this
是子构造函数)
第二步: 根据父构造函数原型 创建独立的子构造函数原型, 且要求子构造函数原型的__proto__
属性指向子构造函数
第二步
解决方法:
Son.prototype = Object.create(Father.prototype)
第三步: 将子构造函数原型的constractor
指向子构造函数
解决方法
Son.prototype.constractor = Son
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>完美继承</title> <script> function Father(name){ this.name = name; } Father.prototype.sayName = function(){ console.log(this.name) }; function Son(name, age){ // 第一步: 获取父构造函数函数体内的属性 Father.call(this, name) } // 第二步: 根据父构造函数原型 创建独立的子构造函数原型, 且要求子构造函数原型的__proto__属性指向子构造函数 Son.prototype = Object.create(Father.prototype); // 第三步: 将子构造函数原型的constractor指向子构造函数 Son.prototype.constructor = Son; son1 = new Son("小明", 13); console.log("子对象的原型指向子构造函数:",son1.__proto__ === Son.prototype); console.log("子对象的原型指向父构造函数:",son1.__proto__ === Father.prototype); console.log("打印子对象", son1); son2 = new Son("小红", 14); console.log("打印两个子对象的属性",son1, son2); son1.sayName(); son2.sayName(); // 重新父原型内的方法 ,观察是否会对父原型产生影响 Son.prototype.sayName = function(){ console.log("子原型函数sayName", this.name); }; // 父实例对象调用sayName father1 = new Father("老王"); father1.sayName(); // 子实例调用sayName son1.sayName(); son2.sayName(); </script> </head> <body> </body> </html>
执行结果
小结
第一步(为了获取父构造函数函数体内的属性): 用子构造函数
this
, 去执行父构造函数, 最终使父构造函数的属性被附加到了子构造函数this
上.第二步(为了完美获取父构造函数原型): 要理解
b = Object.create(a)
,创建出实例a的__proto__
依然是指向a的, 即b.__proto__ === a
第三步(为了使子构造函数的实例能正确指向子构造函数): 很类似双向链表中替换单个节点的操作.
点击查看更多内容
为 TA 点赞
评论
共同学习,写下你的评论
评论加载中...
作者其他优质文章
正在加载中
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦