zoukankan      html  css  js  c++  java
  • js oop中的三种继承方法

     JS OOP 中的三种继承方法:

     很多读者关于js opp的继承比较模糊,本文总结了oop中的三种继承方法,以助于读者进行区分。

     <继承使用一个子类继承另一个父类,子类可以自动拥有父类的属性和方法。(继承的两方,发生在两个类之间)>

    一、通过object实现继承

    1:定义父类
    function Parent(){}
    2:定义子类
    funtion Son(){}
    3:通过原型给Object对象添加一个扩展方法。
    Object.prototype.customExtend = function(parObj){
    for(var i in parObj){
    // 通过for-in循环,把父类的所有属性方法,赋值给自己
    this[i] = parObj[i];
    }
    }
    4:子类对象调用扩展方法
    Son.customExtend(Parent);

     1         // 1.定义父类
     2         function Person(name,age){
     3             this.name = name;
     4             this.age = age;
     5             this.say = function(){
     6                 alert(this.name+":"+this.age);
     7             }
     8         }
     9         // 2.定义子类
    10         function Student(no){
    11             this.no = no;
    12             this.add = function(a,b){
    13                 alert(a+b);
    14             }
    15         }
    16         function Programmer(lang){
    17             this.lang = lang;
    18             this.codding = function(){
    19                 alert("我爱敲代码!敲代码使我快乐!");
    20             }
    21         }
    22         // 3.通过原型给Object对象添加一个扩展方法。
    23         Object.prototype.customExtend = function(parObj){
    24             for(var i in parObj){ 
    25                 // 通过for-in循环,把父类的所有属性方法,赋值给自己
    26                    this[i] = parObj[i];
    27             }
    28         }
    29         
    30         var p = new Person("小明","18");
    31         var s = new Student("0001");
    32         s.customExtend(p);//现在s继承了p的所有属性和方法。
    33         console.log(s)
    34         
    35         var pro = new Programmer("JavaScript");
    36         pro.customExtend(p);
    37         console.log(pro)
    38         

    二、使用call和apply进行继承

    首先,了解一下call和apply:通过函数名调用方法,强行将函数中的this指向某个对象;
     call写法: func.call(func的this指向的obj,参数1,参数2...);
     apply写法: func.apply(func的this指向的obj,[参数1,参数2...]);
    call与apply的唯一区别:在于接收func函数的参数方式不同。call采用直接写多个参数的方式,而apply采用是一个数组封装所有参数。
    ② 使用call和apply
    1:定义父类
    funtion Parent(){}
    2:定义子类
    function Son(){}
    3:在子类中通过call方法或者apply方法去调用父类。
    function Son(){
    Parent.call(this,....);
    }

     1 function Person(name,age){
     2             this.name = name;
     3             this.age = age;
     4             this.say = function(){
     5                 alert("我叫:"+this.name+";今年:"+this.age+"岁");
     6             }
     7         }
     8 function Student(no,stuName,stuAge){
     9             
    10             this.no = no;
    11             Person.call(this,stuName,stuAge);
    12                  }
    13 var stu = new Student(12,"zhangsan",14);
    14         stu.say();
    15         
    16         console.log(stu)

    三、使用原型继承

    ③ 使用原型继承
    1:定义父类
    function Parent(){}
    2:定义子类
    function Son(){}
    3:把在子类对象的原型对象声明为父类的实例。
    Son.prototype = new Parent();

     1 function Person(name,age){
     2             this.name = name;
     3             this.age = age;
     4             this.say = function(){
     5                 alert("我叫:"+this.name+";今年:"+this.age+"岁");
     6             }
     7         }
     8 function Student(no){
     9             this.no = no;
    10         }
    11         
    12         Student.prototype = new Person("张三",14)
    13         
    14         var stu = new Student(12);
    15         
    16         stu.say();
    17         
    18         console.log(stu)

    希望以上代码能够帮助读者解决继承的问题!

  • 相关阅读:
    《极客时间--算法面试》--二叉树
    《极客时间--算法面试》-哈希表
    《极客时间-算法面试》-堆栈和队列
    《极客时间-算法面试》-数组和链表
    《极客时间-算法面试》
    《极客时间-算法面试》如何计算复杂度
    查找算法
    排序算法
    AI 期刊会议
    《剑指offer》数组中只出现一次的数字
  • 原文地址:https://www.cnblogs.com/GlenLi/p/6854278.html
Copyright © 2011-2022 走看看