zoukankan      html  css  js  c++  java
  • JS实现继承

    1.原型链实现继承

    //父类型

    function Supper(){

      this.supProp = 'Supper property';

    }

    Supper.prototype.showSuperProp = function(){

      console.log(this.supProp);

    }

    //子类型

    function Sub(){

      this.subProp= 'Sub property';

    }

    //子类型的原型指向父类型的实例就实现了继承,子类型生成的对象的原型链上就有了父类型的东西

    Sub.prototype = new Supper();

    //让Sub的构造函数指向Sub,不然生成的Sub对象的构造函数会错误的指向Supper

    Sub.constrator = Sub;

    Sub.prototype .showSubProp = function(){

      console.log(this.subProp);

    }

    //使用子类型生成对象

    var sub = new Sub();

    sub .showSuperProp ();

    sub.showSubProp ();

    理解:主要是将子类型的prototype 指向父类型的一个实例,父类型的实例上面就有父类型的所有属性和方法,然后再用子类型生成实例的时候,生成的实例的__proto__指向子类型的prototype相当于是父类型的一个实例,所以上面又有了父类型的所有属性和方法,从而实现了继承的效果。

    注:这种方式主要是为了子类型继承父类型的方法,如果父类型的构造函数有参数,那么在定义子类型的prototype为父类型的一个实例的时候就需要传入参数,比较鸡肋。

    2.借用构造函数继承

    function Person(name,age){

      this.name = name;

      this.age = age;

    }

    function Student(name,age,grade){

      Person.call(this,name,age);//这里相当于将Student中的this传入了Person的构造函数替换原this执行代码;相当于:this.name = name;this.age = age;

      this.grade = grade;

    }

    注:这种方式只是在子类的构造函数中借用了父类的构造函数,并不是真正的继承

    3.原型链+借用构造函数实现组合继承

    function Person(name,age){

      this.name = name;

      this.age = age;

    }

    Person.prototype.setName = function(){

      this.name = name;

    }

    function Student(name,age,grade){

      Person.call(this,name,age);

      this.grade = grade;

    }

    //这里new Person的时候不用传入参数,只是为了继承Person中的方法,Person中的属性已经使用借用构造函数的方式存在在了Stundent中了

    Student.prototype = new Person();

    Student.constrator = Student;

    //两种方式结合后能够较好的实现继承

  • 相关阅读:
    vim 编辑器使用
    PHP高并发高负载系统架构(转载)
    类的使用
    linux下EC20 4G模块驱动移植
    linux 4G模块拨号脚本
    linux4.1.4上移植ME909s-821,MU609 4G模块驱动
    shell脚本语之运算符
    vim的列编辑操作
    linux下普通用户添加 sudo 免密码
    4G模块在AM335x上的移植
  • 原文地址:https://www.cnblogs.com/maycpou/p/12286797.html
Copyright © 2011-2022 走看看