JS继承方式【更新发布】

PS:本文为《Javascript 高级程序设计》中继承中的学习笔记。

?JS继承方式

1.对象冒充
原理:构造函数使用了this关键字给所有属性和方法赋值(既采用类声明的构造函数方式)。因为构造函数只是一个函数,所以可使用ClassA的构造函数成为ClassB的方法,然后调用它。ClassB就会收到ClassA的构造函数中的属性和方法。

JavaScript代码
  1. function?ClassA(sColor){ ??
  2. ????this.color=sColor; ??
  3. ????this.sayColor=function(){ ??
  4. ????????alert(this.color); ??
  5. ????}; ??
  6. } ??
  7. function?ClassB(sColor,sName){ ??
  8. ????this.newMethod=ClassA; ??
  9. ????this.newMethod(sColor); ??
  10. ????delete?this.newMethod; ??
  11. ???? ??
  12. ????this.name=sName; ??
  13. ????this.sayName=function(){ ??
  14. ????????alert(this.name); ??
  15. ????}; ??
  16. } ??
  17. var?objA=new?ClassA(“red”); ??
  18. var?objB=new?ClassB(“blue”,“”); ??
  19. objA.sayColor(); ??
  20. objB.sayColor(); ??
  21. objB.sayName();??

?2.call()方法:

JavaScript代码
  1. function?sayColor(sa,ab){ ??
  2. ????alert(sa+this.color+this.age+ab); ??
  3. }; ??
  4. var?obj=new?Object; ??
  5. obj.color=“red”; ??
  6. obj.age=24; ??
  7. sayColor.call(obj,“aaaa”,“adadad”);??

?用call()可以改造,例如第一个例子:

?

JavaScript代码
  1. function?ClassA(sColor){???? ??
  2. ????this.color=sColor;???? ??
  3. ????this.sayColor=function(){???? ??
  4. ????????alert(this.color);???? ??
  5. ????};???? ??
  6. }???? ??
  7. function?ClassB(sColor,sName){???? ??
  8. ????//this.newMethod=ClassA;???? ??
  9. ????//this.newMethod(sColor);???? ??
  10. ????//delete?this.newMethod;?? ??
  11. ????ClassA.call(this,sColor); ??
  12. ???????? ??
  13. ????this.name=sName;???? ??
  14. ????this.sayName=function(){???? ??
  15. ????????alert(this.name);???? ??
  16. ????};???? ??
  17. }???? ??
  18. var?objA=new?ClassA(“red”);???? ??
  19. var?objB=new?ClassB(“blue”,“”);???? ??
  20. objA.sayColor();???? ??
  21. objB.sayColor();???? ??
  22. objB.sayName();???
赞(0) 打赏
未经允许不得转载:WEB前端开发 » JS继承方式【更新发布】

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准

联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏