继承

1、冒充方式-------实现继承

<script type="text/javascript">

                    function CreatPerson (name,age) {
                            this.name = name;
                            this.age = age;
                            this.sayHi = function () {
                                    alert("哈哈");
                            }
                    }

                    function CreatStudent (name, age, banJi) {

// 通过冒充实现子类继承父类的方法、属性

                          this.newFn = CreatPerson; 

//1、 给this(也就是学生对象)添加一个新的方法,也就是CreatPerson这个构造函数

                 this.newFn(name, age); 

//2、 执行新添加进去的函数,通过this.newFn调用父类函数,进而修改了父类函数中this指针的指向,

                            delete this.newFn; // 3、删除这个函数(过河拆桥)
                            
                            this.banJi = banJi;
                            
                            this.study = function () {
                                    alert("学习");
                            };
                            
                    }
                    
                    var stu1 = new CreatStudent("李威", 23, 9);
                    console.log(stu1.study);
            </script>

复制代码

2、原型方式实现继承

<script type="text/javascript">
                        function CreatAnimal (name, age) {
                                this.name = name;
                                this.age = age;
                                this.sayHi = function () {
                                        alert("你好");
                                };
                        }
                        CreatAnimal.prototype.gender = "男";
                        CreatAnimal.prototype.sayBye = function () {
                                alert("走吧");
                        } 
                        function CreatDog (name, age, leg) {
                                this.leg = leg;
                                this.lookDoor = function () {
                                        alert("看门");
                                }
                        }

把父类的对象当做子类的原型,这样就把子类的原型和父类的原型联系在一起了

                        CreatDog.prototype = new CreatAnimal("李淑芬",12);

因为对象的constructor属性值是取决于原型中的constructor值的,而此时原型中constructor值指向的是父类函数,所以要修改原型的constructor值为子类函数,保证继承关系不混乱

                    CreatDog.prototype.constructor = CreatDog;
                        
                        var dog = new CreatDog("旺财", 12, 4);
//                      console.log(dog.name);
                        console.log(dog.gender);
                        dog.sayBye();
                        console.log(dog.constructor == CreatDog);
                        
//                        dog.sayHi();
                        
                        
                        
                        
                </script>

3、call方式实现继承

<script type="text/javascript">

//父类构造函数
                function CreatPerson(name,age,gender){
                        this.name = name;
                        this.age = age;
                        this.gender = gender;
                        this.walk = function(){
                                console.log("走的舒服吗")
                }
 //父类原型
                /*CreatPerson.prototype.walk = function(){
                        console.log("走的舒服吗")*/
                }
                
//子类
                function CreatStudent(name,age,gender,hobby){
                        CreatPerson.call(this,name,age,gender)
                        this.hobby = hobby;
                        /*this.walk =function(){
                                console.log("走的爽不")
                        };*/
                        this.study = function(){
                                console.log("学的爽不")
                        }
                }
   //子类原型方法
                /*CreatStudent.prototype.walk = function(){
                        console.log("走的很不爽")
                }
                CreatStudent.prototype.study = function(){
                        console.log("学习好舒服")
                }*/
                
                
  //创建子对象
                var s1 = new CreatStudent("李培舟",23,"男","吃")
                console.log(s1.name);
                console.log(s1.age);
                console.log(s1.gender);
                console.log(s1.walk());
                console.log(s1.study());
                
                
        </script>

4、组合方式实现继承

<script type="text/javascript">
        //父类构造函数
                function CreatPerson(name,age,gender){
                        this.name = name;
                        this.age = age;
                        this.gender = gender;
                        /*this.walk = function(){
                                console.log("走的舒服吗")*/
                }
        //父类原型
                CreatPerson.prototype.walk = function(){
                        console.log("走的舒服吗")
                }
                
                //子类
                function CreatStudent(name,age,gender,hobby){
                        CreatPerson.call(this,name,age,gender)
                        this.hobby = hobby;
                        /*this.walk =function(){
                                console.log("走的爽不")
                        };*/
                        /*this.study = function(){
                                console.log("学的爽不")
                        }*/
                }
                //子类原型方法
                /*CreatStudent.prototype.walk = function(){
                        console.log("走的很不爽")
                }*/
                CreatStudent.prototype.study = function(){
                        console.log("学习好舒服")
                }
                
                CreatStudent.prototype = new CreatPerson();
                CreatStudent.prototype.constructor = CreatPerson;
                
                
                //创建子对象
                var s1 = new CreatStudent("李培舟",23,"男","吃")
                console.log(s1.name);
                console.log(s1.age);
                console.log(s1.gender);
                console.log(s1.hobby);
                console.log(s1.walk());
                </script>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 继承是面向对象中一个比较核心的概念。其他正统面向对象语言都会用两种方式实现继承:一个是接口实现,一个是继承。而EC...
    lovelydong阅读 2,900评论 0 2
  • 博客内容:什么是面向对象为什么要面向对象面向对象编程的特性和原则理解对象属性创建对象继承 什么是面向对象 面向对象...
    _Dot912阅读 5,274评论 3 12
  • 继承 Javascript中继承都基于两种方式:1.通过原型链继承,通过修改子类原型的指向,使得子类实例通过原型链...
    LeoCong阅读 2,688评论 0 0
  • 1、构造函数模式 [url=]file:///C:/Users/i037145/AppData/Local/Tem...
    横冲直撞666阅读 4,288评论 0 0
  • 本文先对es6发布之前javascript各种继承实现方式进行深入的分析比较,然后再介绍es6中对类继承的支持以及...
    lazydu阅读 16,755评论 7 44