在ES5怎么实现继承-优快云博客

本文链接：https://blog.youkuaiyun.com/zhangzhixiong_/article/details/136990248

本文介绍了JavaScript中两种继承方式：原型链继承通过子类原型指向父类实例实现属性和方法继承，但可能导致原型共享的问题；构造函数继承通过子类构造函数调用父类构造函数，但无法直接继承原型链上的属性和方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

**第一种原型链继承：**让子类的原型对象指向父类的实例实现对父类的属性和方法的继承

        // 定义父类
        function Animal(){ //父类
            this.name = 'cat'
        }
        Animal.prototype.getName = function(){ // 在Animal的原型链上绑定一个方法用来获取名字
            return this.name
        }
        // 定义子类
        function Felidae(){

        }
        Felidae.prototype = new Animal() //让子类的原型指向父类

        const felidae = new Felidae()
        console.log(felidae.getName())//cat--继承了父类的方法
        console.log(felidae.name)//cat--继承了父类的属性     
		
        /**
         * 缺陷：由于所有Felidae实例原型都指向同一个实例,
         *  因此对某个Felidae实例的来自父类的引用类型变量修改会影响所有的Felidae实例
         * 因为创建子类时没有向父类传参所以，没有实现super功能
         * /

**第二种构造函数继承：**在子类的构造函数中执行父类的构造函数，并为其绑定之类的this；

        // 定义父类
        function Animal(name){
            this.name = name
        }
        // 为父类绑定方法
        Animal.prototype.getName = function(){
            return this.name
        }
        // 定义子类
        function Felidae(){
           Animal.apply(this,arguments) 
        }
        const felidae = new Felidae('zhangsan')
        console.log(felidae.name)//zhangsan
        console.log(felidae.getName())//缺陷：继承不到父类原型的属性和方法 test.html:23 Uncaught TypeError: felidae.getName is not a function