你的位置:首页 > Java教程

[Java教程]谈谈JavaScript的2种主要继承方式


    今天给自己巩固一下js的继承知识,基础不好,有不对的地方,请尽量拍砖,越重越好。

    js继承方法最主要的是2种,一种是通过原型的方式,一种是通过借用call&apply的构造函数方式。

 

    1.原型(prototype):

 

 1 function Body(name,age){// 创建一个Body类 2   this.name = name;// 赋予基础属性name、age 3   this.age = age; 4 } 5 Body.prototype.sayName =function() {// 给原型定义一个sayName的方法 6   console.log(this.name); 7 } 8 var a = new Body('wutao','10');//创建一个Body的实例对象 9 10 function Another(){}11 Another.prototype = new Body('www');//将Body实例对象给新创建的子类(Another)的prototype属性,这样,Another就拥有了Body的属性和方法12 var b = new Another();//创建Another子类的实例13 Another.prototype.sex ="mail";//定义子类的属性及方法14 Another.prototype.saySex = function(){15   console.log(this.sex);16 }17 a.sayName();//wutao18 b.sayName();//www 实例b拥有父类Body的方法sayName19 b.saySex();//mail 实例b拥有自己定义的方法saySex

 

    2.借用构造函数(call&apply),也可以理解为组合式继承

    

    call:

 1 function Person(name){ 2   this.name = name; 3   this.sayHello = function(){ 4     console.log(this.name); 5   } 6 } 7  8 function Son(name,age){ 9   Person.call(this,name,age);//call用法:将this指针指向父类构造函数,并依次传入参数,使其拥有父类的属性和方法10   this.age = age;11   this.sayFunc = function(){12     console.log(this.name+"-"+this.age);13   } 14 }15 var a = new Person('wutao');16 var b = new Son("wwwwww",22);17 a.sayHello();//wutao18 b.sayHello();//wwwwww; 通过call继承来的父类Person的方法sayHello19 b.sayFunc();//wwwwww-22

    apply:

 1 function Person(name){ 2   this.name = name; 3   this.sayHello = function(){ 4     console.log(this.name); 5   } 6 } 7  8 function Son(name,age){ 9   Person.apply(this,[name,age]);//apply用法:类似call,将this指针指向父类构造函数,并传入一个由参数组成的数组参数,使其拥有父类的属性和方法10   this.age = age;11   this.sayFunc = function(){12     console.log(this.name+"-"+this.age);13   } 14 }15 var a = new Person('wutao');16 var b = new Son("ttt",222);17 a.sayHello();//wutao18 b.sayHello();//ttt;通过apply继承来的父类Person的方法sayHello

19 b.sayFunc();//ttt-222

    

    js最主要的继承方法就这2种,当然,还有几种继承方法,但是有些继承方式在创建了实例之后,修改实例方法和属性会直接修改原型的方法和属性,那这样的继承就显得意义不大了,除非是业务有类似的需求才会去用到。

    有不足的地方,希望大虾大神们指出!