constructor属性始终指向创建当前对象的构造函数。

比如下面的例子:

 // 等价于 var foo = new Array(1, 56, 34, 12);
var arr = [1, 56, 34, 12];
console.log(arr.constructor === Array); // true
// 等价于 var foo = new Function();
var Foo = function() { };
console.log(Foo.constructor === Function); // true
// 由构造函数实例化一个obj对象
var obj = new Foo();
console.log(obj.constructor === Foo); // true // 将上面两段代码(第6,9行)合起来,就得到下面的结论
console.log(obj.constructor.constructor === Function); // true

但是当constructor遇到prototype时,有趣的事情就发生了。

我们知道每个函数都有一个默认的属性prototype,而这个prototype的constructor(prototype.constructor)默认指向这个函数。

如下例所示:

  1.  function Person(name) {
    this.name = name;
    };
    Person.prototype.getName = function() {
    return this.name;
    };
    var p = new Person("TT"); console.log(p.constructor === Person); // true
    console.log(Person.prototype.constructor === Person); // true
    // 将上两行代码合并就得到如下结果
    console.log(p.constructor.prototype.constructor === Person); // true

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

如下示例:

  1.  function Person(name) {
    this.name = name;
    };
    Person.prototype = {
    getName: function() {
    return this.name;
    }
    };
    var p = new Person("TT");
    console.log(p.constructor === Person); // false
    console.log(Person.prototype.constructor === Person); // false
    console.log(p.constructor.prototype.constructor === Person); // false

为什么呢?

原来是因为覆盖Person.prototype时,等价于进行如下代码操作:

  1.  Person.prototype = new Object({  //Object的实例
    getName: function() {
    return this.name;
    }
    });

而constructor属性始终指向创建自身的构造函数,所以此时Person.prototype.constructor === Object,即是:

  1.  function Person(name) {
    this.name = name;
    };
    Person.prototype = { //注意是字面量方式
    getName: function() {
    return this.name;
    }
    };
    var p = new Person("TT");
    console.log(p.constructor === Object); // true
    console.log(Person.prototype.constructor === Object); // true
    console.log(p.constructor.prototype.constructor === Object); // true

怎么修正这种问题呢?方法也很简单,重新覆盖Person.prototype.constructor即可:

  1.  function Person(name) {
    this.name = name;
    };
    Person.prototype = new Object({
    getName: function() {
    return this.name;
    }
    });
    Person.prototype.constructor = Person; //重新指向Person
    var p = new Person("TT");
    console.log(p.constructor === Person); // true
    console.log(Person.prototype.constructor === Person); // true
    console.log(p.constructor.prototype.constructor === Person); // true

JavaScript对象中的constructor属性的更多相关文章

  1. JavaScript对象中的this属性

    this属性表示当前对象,如果在全局作用范围内使用this,则指代当前页面对象window: 如果在函数中使用this,则this指代什么是根据运行时此函数在什么对象上被调用. 我们还可以使用appl ...

  2. JavaScript对象中的属性(可写,可配置,可枚举,value,getter,setter)

    JavaScript中,对象包括3个特性,分别为,可扩展性,class标识符,属性. 如果对象的可扩展性为false,则不可为对象动态的添加属性.   对象包含分为存取器属性和值属性.存取属性为 {g ...

  3. JavaScript的事件对象中的特殊属性和方法(鼠标,键盘)

    鼠标操作导致的事件对象中的特殊属性和方法 鼠标事件是 Web 上面最常用的一类事件,毕竟鼠标还是最主要的定位设备.那么通过事件对象可以获取到鼠标按钮信息和屏幕坐标获取等 鼠标按钮 只有在主鼠标按钮被单 ...

  4. js对象中动态读取属性值 动态属性值 js正则表达式全局替换

    $(document).ready(function(){ var exceptionMsg = '${exception.message }'; var exceptionstr = ''; //j ...

  5. [记录] javascript 对象中使用setTimeout

    参考:Javascript对象中关于setTimeout和setInterval的this介绍 使用最后一个方法终于弄好了,简直了,在对象中使用setTimeout原来是这样的 做的是分钟倒计时,倒数 ...

  6. 在实体对象中访问导航属性里的属性值出现异常“There is already an open DataReader associated with this Command which must be closed first”

    在实体对象中访问导航属性里的属性值出现异常“There is already an open DataReader associated with this Command which must be ...

  7. 删除JavaScript对象中的元素

    参考http://stackoverflow.com/questions/208105/how-to-remove-a-property-from-a-javascript-object 通过dojo ...

  8. Javascript 对象的创建和属性的判定

    1. 创建对象的方法: 直接使用new 对Object对象进行操作,即对Object 对象进行实例化 <!DOCTYPE html> <html lang="en" ...

  9. Stream流用于按照对象中某一属性来对集合去重+简单数据类型集合的去重

    上次对Stream流来进行分组的文章很多人看,想看的可以来这: Stream流来进行集合分组 这次小编又带来Stream的去重,话不多数,直接上代码: 这是对简单数据类型的去重 //字符串集合进行简单 ...

随机推荐

  1. android 中如何模拟back键

    主要是在使用Fragment时能够返回前一级,所以才找到了这些资料. 有两种方式可以实现,直接上代码 方法1: public void onBack(){ new Thread(){ public v ...

  2. 自己实现一个shell

    用C实现一个简单的交互式shell,要求:当用户输入一行命令时,识别程序名和参数并调用适当的exec函数执行程序,等待执行完成后给出提示符. exec函数实际上是六种以exec开头的函数,统称exec ...

  3. [ActionScript 3.0] 判断XML属性是否存在

    在as3中判断xml节点是否存在以及判断xml某节点是否存在某属性可用下面方法: if(xml.hasOwnProperty("frameRate")){ trace(" ...

  4. JavaScript高性能开发的十条建议

    JavaScript高性能开发的十条建议 文/开发部 Dimmacro 编者按:javascript开发大部分程序员都做过,写出来的代码质量也千差万别,现在浏览器内嵌的解释器虽然效率已经很高了,但在客 ...

  5. js的事件机制

    js的事件机制 解释:当我们的行为动作满足了一定的条件后,会触发某事务的执行. 内容: 1.单双击事件 单击:onclick 当鼠标单击时候会触发 双击:ondbclick 当鼠标双击时候会触发 2. ...

  6. JavaWeb学习笔记(十七)—— 数据库连接池

    一.数据库连接池概述 1.1 为什么使用数据库连接池 如果用户每次请求都向数据库获得连接,而数据库创建连接通常需要消耗相对较大的资源,创建时间也较长.假设网站一天10万访问量,数据库服务器就需要创建1 ...

  7. 基础篇:4.2)规范化:3d软件工程图纸用模板

    本章目的:分享一些国标标准模板,方便作图时使用 这篇博文的内容作者会定时的更新 1.工程图模板 drawing template 定义 三维机械设计软件中的一种文件类型.通过标准化定制和使用该文件,可 ...

  8. SPOJ 1811 Longest Common Substring(求两个串的最长公共子串 || 或者n个串)

    http://www.spoj.com/problems/LCS/ 题目:求两个串的最长公共子串 参考:https://www.cnblogs.com/autoint/p/10345276.html: ...

  9. python定义的一个简单的shell函数的代码

    把写代码过程中经常用到的一些代码段做个记录,如下代码段是关于python定义的一个简单的shell函数的代码. pipe = subprocess.Popen(cmd, stdout=subproce ...

  10. HTML学习-01

    1.标签描述了基本的链接地址/链接目标,该标签作为HTML文档中所有的链接标签的默认链接. 2.如果<head>里面设置了base,那么后面的img图片需要添加的相对路径. 3.不能使用工 ...