constructor属性解析
时间:2022-04-25
本文章向大家介绍constructor属性解析,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
JavaScript中constructor属性一直不是很清楚,今日终于弄清了其中缘由,下面举例说明。
首先是一个典型的JavaScript实例声明:
function Person(){
this.name = name;
}
var p = new Person('Joe');
console.log(p.constructor === Person); //true
console.log(p.__proto__ === Person.prototype); //true
如果此时对Person的prototype中添加属性或函数:
function Person(){
this.name = name;
}
Person.prototype.getName = function(){
return this.name;
}
var p = new Person('Joe');
console.log(p.constructor === Person); //true
console.log(p.__proto__ === Person.prototype); //true
但是如果对Person的prototype重新定义,将会产生如下结果:
function Person(){
this.name = name;
}
Person.prototype = {
getName : function(){
return this.name;
}
}
var p = new Person('Joe');
console.log(p.constructor === Person); //false
console.log(p.__proto__ === Person.prototype); //true
这里面关系到constructor属性的归属问题,本人试着用下面的代码验证:
Person.__proto__.constructor===Person.constructor //true
p.__proto__.constructor === p.constructor; //true
经过上述验证,可以证明constructor其实是__proto__的属性(此处存疑,因为是个人验证,不清楚上面的验证代码是否精准,如果有误,希望各位指出)。
根据new的工作原理(详见http://www.cnblogs.com/ihardcoder/p/3667372.html),我们知道
p.__proto__ = Person.prototype;
所以
p.constructor = p.__proto__.constructor = Person.prototype.constructor
这样就将问题追溯到Person的prototype指向问题。当用Person.prototype = {}的方式重新定义时,同样根据new的工作原理,其实产生如下改变:
Person.prototype.__proto__ = Object.prototype
从而
p.constructor
= Person.prototype.constructor
= Person.prototype.__proto__.constructor
= Object.prototype.constructor
此时
p.constructor === Object; //true
如何避免constructor属性的混乱,归根结底,我们需要做的是保证instance的constructor属性指向Person.prototype.constructor,而不是Person的父类,所以当修改Person.prototype时需要保证Person.prototype.constructor指向自己。
function Person(){
this.name = name;
}
Person.prototype = {
getName : function(){
return this.name;
}
}
Person.prototype.constructor = Person;
var p = new Person('Joe');
console.log(p.constructor === Person); //false
console.log(p.__proto__ === Person.prototype); //true
- 电子邮件服务器DKIM配置
- 自相矛盾:一个进程可以自成死锁么?
- 数据库安全·开发加密插件
- wordpress无法安装这个包。: PCLZIP_ERR_MISSING_FILE (-4) : Missing archive file 'C:WINDOWSTEMP/wordpress-4.
- 数据库安全·数据加密
- Medium网友开发了一款应用程序 让学习算法和数据结构变得更有趣
- 数据库安全·Token 认证
- 数据库安全·用户/角色认证
- 防止在训练模型时信息丢失 用于TensorFlow、Keras和PyTorch的检查点教程
- 帝国cms如何调用栏目别名作为分类标题?[!--classname--]标签不能用
- 高级软件工程师(面试题)
- 高级软件工程师 2016-9月更新
- Httpclient 调用 HTTPS 加密通道的Restful服务
- 使用 Jersey 调用 Restful 服务
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 如何使用慢查询快速定位执行慢的 SQL?
- 如何使用 EXPLAIN 精准查看执行计划?
- MySQL怎么查看 SQL 的具体执行成本?
- Python 爬虫进阶必备 | 某外卖优惠平台内容加密参数分析
- pytest 自动化测试框架(二)
- Web | Django 与数据库交互,你需要知道的 9 个技巧
- 商机负责人与商机团队负责人不一致时更新团队负责人为商机负责人语句
- mysql常用语句集合(仅供工作日常学习参考)
- 新一代Notebook神器出现,Jupyter危险了!
- vmstat 监视内存使用情况
- Android开发重写Animation实现下拉图片后弹射回去效果示例
- Android 中RxPermissions 的使用方法详解
- Android构建Material Design应用详解
- Android中DrawerLayout实现侧滑菜单效果
- Android获取系统储存以及内存信息的方法(一)