码迷,mamicode.com
首页 > Web开发 > 详细

js的继承问题

时间:2014-08-13 10:28:25      阅读:161      评论:0      收藏:0      [点我收藏+]

标签:js中的继承

今天我们来说说继承的问题吧,以前js的继承总是弄的我头疼死了,现在总算是弄明白了啥是继承,先来个简单的例子:

方式一:

function createPerson(name,age)

{

this.name=name;

this.age=age;

    this.showName=function()

    {

alert(this.name);

    }

}

var p1=new createPerson(‘one‘,18);

var p2=new createPerson(‘two‘,20);

alert(p1.showName==p2.showName) //false;

想知道这个地方为啥弹出来的是false吗? 我来解释解释吧

这个地方,var p1=new createPerson(‘one‘,18);的时候 ,就会执行 createPerson这个函数,我们用new createPerson相当于:

function createPerson(name,age)

{

//var this=new Object() //用new createPerson相当于系统替咱们新建了一个对象;

this.name=name;

this.age=age;

    this.showName=function()

    {

alert(this.name);

    }

    return this;  //用new createPerson相当于系统替咱们返回了这个对象;

}

所以,执行完var p1=new createPerson(‘one‘,18);的时候,就创建了一个p1对象,这个对象上有name和age属性,还有一个showName方法;执行完var p2=new createPerson(‘two‘,20);的时候,就会创建一个p2对象,这个对象也有name和age属性,还有showName方法;虽然执行alert(p1.showName)和alert(p2.showName)的时候,弹出的内容是一样的,但是这里this指的是不同的对象,一个是p1对象,一个是p2对象,p1和p2是不同的2个对象,所以alert(p1.showName==p2.showName) //false;

方式二:

function createPerson(name,age)

{

this.name=name;

this.age=age;

}

createPerson.prototype.showName=function()

{

alert(this.name);

}

var p1=new createPerson(‘one‘,18);

var p2=new createPerson(‘two‘,20);

alert(p1.showName==p2.showName) //true;

在这个例子中,用构造函数createPerson添加属性,然后用原型添加方法,当执行alert(p1.showName==p2.showName)这个的时候,由于p1和p2都没有showName方法,所以就去找他们的父级createPerson.prototype.showName,在他们的父级上找到了showName方法,而且p1和p2都是同一个父级,由于p1和p2都继承了父级的showName方法,所以alert(p1.showName==p2.showName) //true;

js的继承问题,布布扣,bubuko.com

js的继承问题

标签:js中的继承

原文地址:http://blog.csdn.net/huahuili/article/details/38532633

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!