浅谈javascript中的constructor

 更新时间:2016年06月08日 16:45:50   投稿:jingxian  
下面小编就为大家带来一篇浅谈javascript中的constructor。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

constructor,构造函数,对这个名字,我们都不陌生,constructor始终指向创建当前对象的构造函数。

这里有一点需要注意的是,每个函数都有一个prototype属性,这个prototype的constructor指向这个函数,这个时候我们修改这个函数的prototype时,就发生了意外。如

function Person(name,age){
  this.name = name;
  this.age = age;
}

Person.prototype.getAge = function(){
  return this.age;
}
Person.prototype.getName = function(){
  return this.name;
}

var p = new Person("Nicholas",18);
console.log(p.constructor); //Person(name, age)
console.log(p.getAge()); //18
console.log(p.getName()); //Nicholas

但是如果是这样:

function Person(name,age){
  this.name = name;
  this.age = age;
}

Person.prototype = {
  getName:function(){
    return this.name;
  },
  getAge:function(){
    return this.age;
  }
}

var p = new Person("Nicholas",18);
console.log(p.constructor); //Object()
console.log(p.getAge()); //18
console.log(p.getName()); //Nicholas

结果constructor变了。

 原因就是prototype本身也是对象,上面的代码等价于

Person.prototype = new Object({
  getName:function(){
    return this.name;
  },
  getAge:function(){
    return this.age;
  }
});

因为constructor始终指向创建当前对象的构造函数,那么就不难理解上面代码p.constructor输出的是Object了。

对于修改了prototype之后的constructor还想让它指向Person怎么办呢?简单,直接给Person.prototype.constructor赋值就可以了:

Person.prototype = {
  constructor:Person,
  getName:function(){
    return this.name;
  },
  getAge:function(){
    return this.age;
  }
}

以上这篇浅谈javascript中的constructor就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • Js删除数组中某一项或几项的几种方法(推荐)

    Js删除数组中某一项或几项的几种方法(推荐)

    下面小编就为大家带来一篇Js删除数组中某一项或几项的几种方法(推荐)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-07-07
  • js基石系列学习之错误类型

    js基石系列学习之错误类型

    这篇文章主要为大家介绍了js基石系列学习之错误类型示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-05-05
  • DOM相关内容速查手册

    DOM相关内容速查手册

    DOM相关内容速查手册...
    2007-02-02
  • 了解javascript中的Dom操作

    了解javascript中的Dom操作

    DOM 给我们提供了一些方法,让我们可以使用js来控制页面中的标签等。下面小编和大家来一起学习下吧
    2019-05-05
  • 网页中CDATA标记的说明

    网页中CDATA标记的说明

    经常在网页html代码中看见这样的嵌入标签,但实际使用没有用过,特此在记录下。
    2010-09-09
  • 实例讲解JavaScript中的this指向错误解决方法

    实例讲解JavaScript中的this指向错误解决方法

    JavaScript中this指向的处理是令大家普遍头疼的问题,这里我们举一个实例讲解JavaScript中的this指向错误解决方法,需要的朋友可以参考下
    2016-06-06
  • 浅谈JS闭包中的循环绑定处理程序

    浅谈JS闭包中的循环绑定处理程序

    初学者经常碰到的,即获取HTML元素集合,循环给元素添加事件。在事件响应函数中(event handler)获取对应的索引。但每次获取的都是最后一次循环的索引。原因是初学者并未理解JavaScript的闭包特性。
    2014-11-11
  • javaScript知识点总结(必看篇)

    javaScript知识点总结(必看篇)

    下面小编就为大家带来一篇javaScript知识点总结(必看篇)。小编觉得挺不错的,现在就分享 给大家,也给的大家做个参考。一起跟随小编过来看看吧
    2016-06-06
  • php中and 和 &&出坑指南

    php中and 和 &&出坑指南

    在逻辑运算符中,提到与和或,我们可能立刻想到的是&&、||,在php中还有and、or.然而and和or中有一个小小的坑,今天我们就来探讨下php中and 和 &&
    2018-07-07
  • 关于JavaScript的变量的数据类型的判断方法

    关于JavaScript的变量的数据类型的判断方法

    这篇文章主要介绍了关于JavaScript的变量的数据类型的判断方法,JS是一种弱类型语言,其数据类型的相关特性有时也受到不少开发者的诟病,需要的朋友可以参考下
    2015-08-08

最新评论