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. shell脚本小实例

    本文收集了一堆的shell脚本技巧,我说过,我写博客主要是作一些学习笔记,方便自己查阅,所以,我会搞出这么一篇文章,也没有什么不可理解的.关于这些技巧的出处,诶,我也忘了,可能来自theunixsch ...

  2. python list的append()和extend()方法

    引用自:https://www.cnblogs.com/subic/p/6553187.html

  3. php-fpm 操作命令

    以下内容转自 https://www.cnblogs.com/alibai/p/4070076.html 和 https://blog.csdn.net/wzx19840423/article/det ...

  4. [Python]json 错误xx is not JSON serializable

    TypeError: Decimal('1457501') is not JSON serializable 在使用json的时候经常会遇到xxx  is not JSON serializable, ...

  5. P4173 残缺的字符串

    题目链接 题意分析 啥 ? ? ? \(FFT\)做字符串匹配 可是就是这样 我们定义匹配函数 我们定义\(A\)是匹配串 \(B\)是被匹配串 我们当前到达\(B\)串的\(x\)位置 \[P(x) ...

  6. 使用bootstrap-table等自动使用ajax地址载入数据的插件的数据设计建议

    提出问题: bootstrap-table 可以根据ajax地址load的json数据.这个json数据一般就是数据库中查询的结果,而数据库中存放的数据一般不是用户友好的,比如数据表示一般使用简洁id ...

  7. Android Fragment原理及应用

    1.Fragment简介 Fragment(片段) 表示 Activity 中的行为或用户界面部分.您可以将多个片段组合在一个 Activity 中来构建多窗格 UI,以及在多个 Activity 中 ...

  8. 123th LeetCode Weekly Contest Add to Array-Form of Integer

    For a non-negative integer X, the array-form of X is an array of its digits in left to right order.  ...

  9. windows下实现屏幕分享(C#)

    采用UDP广播进行数据的传输,实现windows下进行低延迟的屏幕共享. 开发语言:C# 第三方组件:Redis 1.实现思路 总体流程图 DGIS.DesktopShare实现windows下屏幕分 ...

  10. 使用python uiautomation从钉钉网页版提取公司所有联系人信息

    之前写了一个提取QQ群里所有人信息的脚本 https://www.cnblogs.com/Yinkaisheng/p/5114932.html 今天写一个从钉钉网页版提取公司所有人通讯录的脚本,,本脚 ...