js中的继承

最新推荐文章于 2025-05-09 11:36:56 发布

转载最新推荐文章于 2025-05-09 11:36:56 发布 · 57 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/wuhongwei/p/7338368.html

本文通过实例详细介绍了JavaScript中使用原型链实现继承的方法，并探讨了其优缺点。展示了如何通过设置子类原型为父类实例来使子类继承父类的方法。

本来今天是打算是做redux的一些讲解的，但是今天早上刷博客的时候看到一篇和有意思的js继承的博客，就像把我自己对于js继承的理解写下了，

1:原型链继承

原理：就是将父类的实例当作子类的原型

 1         function Animal(){
 2         }
 3 
 4         Animal.prototype.sex=null;
 5 
 6         Animal.prototype.sleep=function(){
 7             console.log('我是'+this.name+',我要睡觉了');
 8         }
 9 
10         Animal.prototype.changeSex=function(str){
11             Animal.prototype.sex=str;
12         }
13 
14 
15 
16 
17         const cat=function(name){
18         };
19 
20         cat.prototype=new Animal();    
21     
22         const Tom=new cat();
23         Tom.name="汤姆",  
24         Tom.sleep();  //我是汤姆,我要睡觉了
25         Garfield.changeSex("我是公猫");
26         console.log(Tom.sex); //我是公猫
27 
28 
29         const Garfield=new cat();
30         Garfield.name='加菲猫';
31         Garfield.sleep(); //我是加菲猫,我要睡觉了
32 
33         Garfield.changeSex("我是母猫");
34 
35         console.log(Garfield.sex); //我是母猫
36 
37         console.log(Tom.sex)  //我是母猫

　　大家仔细看这段代码，申明一个动物方法，申明猫方法，猫方法继承动物方法的实例，实例化“汤姆”和“加菲猫”两继承猫方法的实例，可以发现，这两个实例都是具备动方法的基本功能“睡觉”，但是动物都是有性别的的，公用一个sex属性，当“加菲猫”的sex发生变化的时候，“汤姆”的sex也改变了，说明了，实例的时候，prototype是共享的。

优点：

继承关系清晰明了
父类的所有方法子类都可以访问

缺点：

新增方法只能在实例上写，不够随意重写父类的属性和方法（因为所有子类共享一套原型方法），
无法多继承
子类创建无法想父类传参

转载于:https://www.cnblogs.com/wuhongwei/p/7338368.html