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. 【QTP专题】01_安装时报DLL无法注册(转载)

    安装QTP过程中报很多DLL注册失败,全部忽略后安装完成,结果打开QTP录制的脚本无法保存,(点击保存按钮没反应) 1.问题分析: 问题a 使用精减版的操作系统 问题b  需要IE 6.0 及以上版本 ...

  2. 迫不得已! ! 仅仅针对IE浏览器的样式,尤其是IE8及以下

    IE10不会起作用,IE9,8,7,6,5都可以 <html> <head> <title>IE打开就是蓝色背景,白色的字体</title> <! ...

  3. UIViewController读书笔记

    当一个VC把另一个VC作为子view加到自己的view时,一定要先调用addChildViewController(_:)方法. 因为一个VC的root view,也就是VC的view只能被这个VC持 ...

  4. UIResponder笔记

    UIResponder是什么 可以响应UIEvent的类,是UIApplication, UIView及UIViewController的父类.它的父类是NSObject 管理第一响应者. 是否是第一 ...

  5. Linux/Windows 平台最容易安装 Composer教程

    我们采用的是全局安装方式,这样的话,就能够在命令行窗口中直接执行 composer 命令了. Mac 或 Linux 系统: 打开命令行窗口并执行如下命令将前面下载的 composer.phar 文件 ...

  6. 2016级算法第四次上机-B ModricWang的序列问题

    1019 ModricWang的序列问题 思路 此题题意非常清晰,给定一个序列,求出最长上升子序列的长度.从数据规模来看,需要\(O(nlogn)\) 的算法. \(O(nlongn)\) 求最长上升 ...

  7. HTML-常用标签与表格标签

    超链接标签: <a href="超链接地址" target="_blank">超链接的文字</a> _blank或new是在新网页中打开 ...

  8. 【Template】Miller Rabin

    #include<cstdio> #include<cstring> #include<iostream> #include<algorithm> #i ...

  9. P4027 [NOI2007]货币兑换

    传送门 首先有一个显然的贪心,每次操作都要做到底,为了最优不会出现只卖一部分或者只买一部分的操作 所以设 $f[i]$ 表示前 $i$ 天得到的最大价值,那么对于每一个 $i$,枚举所有 $j< ...

  10. 怎么搭建vue-cli脚手架

    我们在使用vue搭建项目的时候,经常要使用到vue-cli. 一.安装node.js 去node官网下载并安装node,一直next就行. 等待安装完毕,输入node-v,如果输出版本号,那说明已经成 ...