A5下载 - 努力做内容最丰富最安全的下载站!

A5站长下载站

当前位置:A5下载 > 编程开发 > 网站开发 > 浅析2种JavaScript继承方式

浅析2种JavaScript继承方式

时间:2015-12-04 11:51作者:fang人气:11

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

1.原型(prototype):

function Body(name,age){// 创建一个Body类

this.name = name;// 赋予基础属性name、age

this.age = age;

}

Body.prototype.sayName =function() {// 给原型定义一个sayName的方法

console.log(this.name);

}

var a = new Body('wutao','10');//创建一个Body的实例对象

function Another(){}

Another.prototype = new Body('www');//将Body实例对象给新创建的子类(Another)的prototype属性,这样,Another就拥有了Body的属性和方法

var b = new Another();//创建Another子类的实例

Another.prototype.sex ="mail";//定义子类的属性及方法

Another.prototype.saySex = function(){

console.log(this.sex);

}

a.sayName();//wutao

b.sayName();//www 实例b拥有父类Body的方法sayName

b.saySex();//mail 实例b拥有自己定义的方法saySex

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

call:

function Person(name){

this.name = name;

this.sayHello = function(){

console.log(this.name);

}

}

function Son(name,age){

Person.call(this,name,age);//call用法:将this指针指向父类构造函数,并依次传入参数,使其拥有父类的属性和方法

this.age = age;

this.sayFunc = function(){

console.log(this.name+"-"+this.age);

}

}

var a = new Person('wutao');

var b = new Son("wwwwww",22);

a.sayHello();//wutao

b.sayHello();//wwwwww; 通过call继承来的父类Person的方法sayHello

b.sayFunc();//wwwwww-22

apply:

function Person(name){

this.name = name;

this.sayHello = function(){

console.log(this.name);

}

}

function Son(name,age){

Person.apply(this,[name,age]);//apply用法:类似call,将this指针指向父类构造函数,并传入一个由参数组成的数组参数,使其拥有父类的属性和方法

this.age = age;

this.sayFunc = function(){

console.log(this.name+"-"+this.age);

}

}

var a = new Person('wutao');

var b = new Son("ttt",222);

a.sayHello();//wutao

b.sayHello();//ttt;通过apply继承来的父类Person的方法sayHello

b.sayFunc();//ttt-222

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

以上就是关于JavaScript继承方式的详细介绍,希望对大家的学习有所帮助。

标签浅析,2种,JavaScript,继承,方式,继承,方法,最

相关下载

查看所有评论+

网友评论

网友
您的评论需要经过审核才能显示

公众号