当前位置:首页 > javascript > 正文

Javascript中this、prototype、constructor的理解

在Javascript面向对象的编程中我们常常会见到这三个关键字:thisprototypeconstructor
对这三个关键字的理解是对Javascript面向对象编程理解的要点

在很多框架,精致的代码中,都会使用this这个关键词:

一、首先我们来说说“this”:
  1、this表示当前对象;
  2、如果在全局作用范围内使用this,则指代当前页面对象window;
  3、如果在函数中使用this,则this指代什么是根据运行时此函数在什么对象上被调用
  4、我们还可以使用apply和call两个全局方法来改变函数中this的具体指向。

下面在来看看apply和call是如何来改变this的指向的

因为在JavaScript中函数也是对象,所以我们可以看到如下的例子

二、什么是原型(prototype)

  1、prototype本质上还是一个JavaScript对象;

  2、每个函数都有一个默认的prototype属性;

  3、通过prototype我们可以扩展Javascript的内建对象

如果这个函数被用在创建自定义对象的场景中,我们称这个函数为构造函数。 比如:

我们可以通过prototype扩展Javascript的内建对象,例如:

注意:这里有一个陷阱,向Array的原型中添加扩展方法后,当使用for-in循环数组时,这个扩展方法也会被循环出来。

下面的代码说明这一点(假设已经向Array的原型中扩展了min方法):

解决方法也很简单:

三、构造器(constructor)

1、constructor始终指向创建当前对象的构造(初始化)函数。
2、每个函数都有一个默认的属性prototype,而这个prototype的constructor默认指向这个函数

我们来看个例子:

但是当constructor遇到prototype时,有趣的事情就发生了。
我们知道每个函数都有一个默认的属性prototype,而这个prototype的constructor默认指向这个函数。如下例所示:

复制代码
代码

当时当我们重新定义函数的prototype时(注意:和上例的区别,这里不是修改而是覆盖), constructor的行为就有点奇怪了,如下示例

为什么呢?
原来是因为覆盖Person.prototype时,等价于进行如下代码操作:
Person.prototype = new Object({getName:function () {
return this.name;
}});
而constructor始终指向创建自身的构造函数,所以此时Person.prototype.constructor === Object
怎么修正这种问题呢?方法也很简单,重新覆盖Person.prototype.constructor即可:

转载于:http://jiangzhengjun.javaeye.com/blog/486450

暂无评论

发表评论