深入浅析JavaScript中的constructor


Posted in Javascript onApril 19, 2016

定义和用法

constructor 属性返回对创建此对象的数组函数的引用。

语法

object.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 ,希望对大家有所帮助!

Javascript 相关文章推荐
ajax 文件上传应用简单实现
Mar 03 Javascript
锋利的jQuery 要点归纳(一) jQuery选择器
Mar 21 Javascript
在chrome浏览器中,防止input[text]和textarea在聚焦时出现黄色边框的解决方法
May 24 Javascript
alert和confirm功能介绍
May 21 Javascript
jQuery中size()方法用法实例
Dec 27 Javascript
javascript关于运动的各种问题经典总结
Apr 27 Javascript
JavaScript实现复制或剪切内容到剪贴板功能的方法
May 23 Javascript
基于vue2实现左滑删除功能
Nov 28 Javascript
JS实现数组的增删改查操作示例
Aug 29 Javascript
js实现通过开始结束控制的计时器
Feb 25 Javascript
微信小程序 调用远程接口 给全局数组赋值代码实例
Aug 13 Javascript
js实现购物车商品数量加减
Sep 21 Javascript
js点击返回跳转到指定页面实现过程
Aug 20 #Javascript
javascript html5摇一摇功能的实现
Apr 19 #Javascript
一些实用性较高的js方法
Apr 19 #Javascript
jQuery移动端日期(datedropper)和时间(timedropper)选择器附源码下载
Apr 19 #Javascript
JavaScript中创建对象的模式汇总
Apr 19 #Javascript
使用PHP+JavaScript将HTML页面转换为图片的实例分享
Apr 18 #Javascript
简单讲解jQuery中的子元素过滤选择器
Apr 18 #Javascript
You might like
oracle资料库函式库
2006/10/09 PHP
php 读写json文件及修改json的方法
2018/03/07 PHP
Jsonp 跨域的原理以及Jquery的解决方案
2010/05/18 Javascript
如何让页面在打开时自动刷新一次让图片全部显示
2012/12/17 Javascript
IE下window.onresize 多次调用与死循环bug处理方法介绍
2013/11/12 Javascript
制作jquery遮罩层效果导航菜单代码分享
2013/12/25 Javascript
jquery.form.js用法之清空form的方法
2014/03/07 Javascript
浅谈Javascript Base64 加密解密
2014/12/28 Javascript
JavaScript设计模式之原型模式(Object.create与prototype)介绍
2014/12/28 Javascript
js实现汉字排序的方法
2015/07/23 Javascript
JavaScript中全选、全不选、反选、无刷新删除、批量删除、即点即改入库(在yii框架中操作)的代码分享
2016/11/01 Javascript
jQuery Position方法使用和兼容性
2017/08/23 jQuery
浅谈JS获取元素的N种方法及其动静态讨论
2017/08/25 Javascript
原生js实现仿window10系统日历效果的实例
2017/10/31 Javascript
js传递数组参数到后台controller的方法
2018/03/29 Javascript
Vuex 快速入门(简单易懂)
2018/09/20 Javascript
jquery实现进度条状态展示
2020/03/26 jQuery
[01:16:12]完美世界DOTA2联赛PWL S2 FTD vs Inki 第一场 11.21
2020/11/23 DOTA
详谈套接字中SO_REUSEPORT和SO_REUSEADDR的区别
2018/04/28 Python
windows下python安装pip图文教程
2018/05/25 Python
Python实现计算文件MD5和SHA1的方法示例
2019/06/11 Python
详解PyCharm安装MicroPython插件的教程
2019/06/24 Python
Python 继承,重写,super()调用父类方法操作示例
2019/09/29 Python
浅析python中while循环和for循环
2019/11/19 Python
python 实现矩阵按对角线打印
2019/11/29 Python
关于python中remove的一些坑小结
2021/01/04 Python
英国最大的专业户外零售商:Mountain Warehouse
2018/06/06 全球购物
中学教师实习自我鉴定
2013/09/28 职场文书
灰雀教学反思
2014/04/28 职场文书
激励口号大全
2014/06/17 职场文书
计算机系统管理员求职信
2014/06/20 职场文书
公司离职证明标准样本
2014/10/05 职场文书
银行业务授权委托书
2014/10/10 职场文书
2015年大学辅导员工作总结
2015/05/12 职场文书
2015年纪委工作总结
2015/05/13 职场文书
Web应用开发TypeScript使用详解
2022/05/25 Javascript