• 继承的几种方式


    js继承的几种方式:原型继承,借用构造函数继承,组合继承(原型继承+借用构造函数继承),拷贝继承

    原型继承

    function Animal(name,weight){
        this.name=name;
        this.weight=weight;
    };
    
    Animal.prototype.eat=function(){
        console.log("我是Animal构造函数的eat方法")
    };
    
    function Dog(color){
        this.color=color
    };
    
    Dog.prototype=new Animal("哮天犬","50kg");   //原理:通过改变原型指向实现继承,优缺点:可以很好的继承方法(如这里的eat方法),但不能很好的继承属性(如这里的name,weight,color)
    let smallDog=new Dog("黑色");
    smallDog.eat();
    

    借用构造函数继承

    function Animal(name,weight){
        this.name=name;
        this.weight=weight;
    };
    
    Animal.prototype.eat=function(){
        console.log("我是Animal构造函数的eat方法")    
    }
    
    function Dog(color,name,weight){   //这里也需要传入借用的构造函数里的属性,这里指Animal构造函数的属性也要传入
        this.color=color;
        Animal.call(this,name,weight);   //借用构造函数继承,需要使用到call语法。优缺点:可以很好的继承属性(如name,weight,color),但不能很好地继承方法(如eat)
            //借用构造函数格式:借用构造函数:构造函数名字.call(当前对象,属性,属性,属性....);
    }
    let smallDog=new Dog("哮天犬","50kg","黑色");
    console.log(smallDog.name,smallDog.weight,smallDog.color);
    smallDog.eat();  //这句代码会报错,因为借用构造函数继承并没有继承到Animal构造函数的eat方法,故不能调用
    

    组合继承(结合了原型继承和借用构造函数继承)

    function Animal(name,weight){
        this.name=name;
        this.weight=weight;
    };
    
    Animal.prototype.eat=function(){
        console.log("我是Animal构造函数的eat方法")    
    }
    
    function Dog(color,name,weight){
        this.color=color;
        Animal.call(this,name,weight);   //借用构造函数继承
    }
    
    Dog.prototype=new Animal();  //原型继承,**注意,组合继承的话这里不需要传值,因为这里的原型继承是用来继承方法的,不用考虑属性**
    let smallDog=new Dog("哮天犬","50kg","黑色");   
    console.log(smallDog.name,smallDog.weight,smallDog.color);  //通过"借用构造函数继承"继承了属性
    smallDog.eat();  //通过"原型继承"继承了方法
     
    

    拷贝继承(将一个对象中的属性和方法通过循环遍历放在另一个对象中)

    function Person() {
    
     }
    Person.prototype.age=10;
    Person.prototype.sex="男";
    Person.prototype.play=function () {
       console.log("玩的好开心");
     };
    
    var obj2={};   
    
    for(var key in Person.prototype){    //通过循环遍历的方法将Person.prototype里的方法放入obj2中
          obj2[key]=Person.prototype[key];
     }
    console.dir(obj2);   //consolew.dir() 打印一个对象的所有属性和方法
    obj2.play();
    

    总结:

    面向对象特性:封装,继承,多态
    继承,类与类之间的关系,面向对象的语言的继承是为了多态服务的,
    js不是面向对象的语言,但是可以模拟面向对象.模拟继承.为了节省内存空间
    原型作用: 数据共享 ,目的是:为了节省内存空间,
    原型作用: 继承 目的是:为了节省内存空间

    继承:
    • 原型继承(改变原型的指向,主要继承方法,不能很好的继承属性)
    • 借用构造函数继承(主要解决属性继承的问题,但不能很好的继承方法)
    • 组合继承:原型继承+借用构造函数继承(既能解决属性问题,又能解决方法问题)
    • 拷贝继承(就是把对象中需要共享的属性或者方法,直接遍历的方式复制到另一个对象中)
  • 相关阅读:
    安居客scrapy房产信息爬取到数据可视化(下)-可视化代码
    安居客scrapy房产信息爬取到数据可视化(上)-scrapy爬虫
    反贪风暴4-猫眼影评从爬取到可视化
    vue实战:路由监听
    vue实战——登录页面
    一个电商首页
    网页换肤
    小游戏—九宫格(拼图游戏)
    复选框(checkbox)、多选框
    CSS实现水平垂直居中
  • 原文地址:https://www.cnblogs.com/huihuihero/p/11310728.html
Copyright © 2020-2023  润新知