JavaScript中in和hasOwnProperty区别详解


Posted in Javascript onAugust 04, 2017

 每当代码读取某个对象的某个属性时,都会执行一次搜索,目标是具有给定名字的属性。搜索首先从对象实例本身开始。如果在实例中找到了具有给定名字的属性,则返回该属性的值;如果没有找到,则继续搜索指针指向的原型对象,在原型对象中查找具有给定名字的属性。如果在原型对象中找到了这个属性,则返回该属性的值。

虽然可以通过对象实例访问保存在原型中的值,但却不能通过对象实例重写原型中的值。如果在实例中添加一个与原型中属性同名的属性,则该属性会屏蔽原型中的那个属性。添加的同名属性只会阻止我们访问原型中的那个属性,但不会修改那个属性。即使将这个属性设置为null,也只会在实例中设置这个属性,而不会恢复其指向原型的链接。

in操作符只要通过对象能访问到属性就返回true。hasOwnProperty()只在属性存在于实例中时才返回true。

使用delete操作符则可以完全删除实例属性,从而让我们能巩固重新访问原型中的属性。

function Person(){
}
Person.prototype.name = "Nicholas";
Person.prototype.age = 29;
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function(){
  alert(this.name);
};
var person1 = new Person();
var person2 = new Person();
alert(person1.hasOwnProperty("name"));//false
alert("name" in person1);//true
person1.name = "Greg";
alert(person1.name);//"Greg"
alert(person1.hasOwnProperty("name"));//true
alert("name" in person1);//true
delete person1.name;
alert(person1.name);//"Nicholas"
alert(person1.hasOwnProperty("name"));//false
alert("name" in person1);//true

prototype

1.每个函数都有一个 prototype 的对象属性,对象内有一个 constructor 属性,默认指向函数本身

2.每个对象都有一个 __proto__ 的属性,属相指向其父类型的 prototype

构造函数和普通函数并没有区别,使用 new 关键字调用就是构造函数,使用构造函数可以 实例化 一个对象

函数的返回值有两种可能

1.显式调用 return 返回 return 后表达式的求值

2.没有调用 return 返回 undefined

function People(name, age) {
 this.name = name;
 this.age = age;
}
var people = new People('Byron', 26);

构造函数返回值

1.没有返回值
2.简单数据类型
3.对象类型

前两种情况构造函数返回构造对象的实例,实例化对象正是利用的这个特性

第三种构造函数和普通函数表现一致,返回 return 后表达式的结果

总结

以上所述是小编给大家介绍的JavaScript中in和hasOwnProperty区别,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
25个好玩的JavaScript小游戏分享
Apr 22 Javascript
使用apply方法处理数组的三个技巧[译]
Sep 20 Javascript
jquery中append()与appendto()用法分析
Nov 14 Javascript
JavaScript获取网页表单提交方式的方法
Apr 02 Javascript
原生js实现图片层叠轮播切换效果
Feb 02 Javascript
总结Javascript中的隐式类型转换
Aug 24 Javascript
webpack常用配置项配置文件介绍
Nov 07 Javascript
weUI应用之JS常用信息提示弹层的封装
Nov 21 Javascript
实例解析js中try、catch、finally的执行规则
Feb 24 Javascript
node.js 核心http模块,起一个服务器,返回一个页面的实例
Sep 11 Javascript
如何通过JS实现日历简单算法
Oct 14 Javascript
vue+elementUI动态增加表单项并添加验证的代码详解
Dec 17 Vue.js
JavaScript hasOwnProperty() 函数实例详解
Aug 04 #Javascript
微信小程序 websocket 实现SpringMVC+Spring+Mybatis
Aug 04 #Javascript
Angular实现响应式表单
Aug 04 #Javascript
JS 实现banner图片轮播效果(鼠标事件)
Aug 04 #Javascript
jQuery选取所有复选框被选中的值并用Ajax异步提交数据的实例
Aug 04 #jQuery
JavaScript正则表达式校验与递归函数实际应用实例解析
Aug 04 #Javascript
js模拟百度模糊搜索的实例
Aug 04 #Javascript
You might like
PHP通过session id 实现session共享和登录验证的代码
2012/06/03 PHP
PHP实现双链表删除与插入节点的方法示例
2017/11/11 PHP
PHP实现函数内修改外部变量值的方法示例
2018/12/28 PHP
Laravel 5.2 文档 数据库 ―― 起步介绍
2019/10/21 PHP
表格 隔行换色升级版
2009/11/07 Javascript
对采用动态原型方式无法展示继承机制得思考
2009/12/04 Javascript
qTip2 精致的基于jQuery提示信息插件
2012/02/17 Javascript
使用node.js 获取客户端信息代码分享
2014/11/26 Javascript
JavaScript在浏览器标题栏上显示当前日期和时间的方法
2015/03/19 Javascript
详解JavaScript中循环控制语句的用法
2015/06/03 Javascript
AngularJS HTML DOM详解及示例代码
2016/08/17 Javascript
jquery控制页面的展开和隐藏实现方法(推荐)
2016/10/15 Javascript
vue计算属性computed、事件、监听器watch的使用讲解
2019/01/21 Javascript
vue实践---根据不同环境,自动转换请求的url地址操作
2020/09/21 Javascript
Python def函数的定义、使用及参数传递实现代码
2014/08/10 Python
python绘制双柱形图代码实例
2017/12/14 Python
Python实现定时精度可调节的定时器
2018/04/15 Python
浅析python中numpy包中的argsort函数的使用
2018/08/30 Python
在python 中实现运行多条shell命令
2019/01/07 Python
对python字典过滤条件的实例详解
2019/01/22 Python
详解Python 解压缩文件
2019/04/09 Python
python系列 文件操作的代码
2019/10/06 Python
在pytorch 中计算精度、回归率、F1 score等指标的实例
2020/01/18 Python
Python 读取WAV音频文件 画频谱的实例
2020/03/14 Python
jupyter 中文乱码设置编码格式 避免控制台输出的解决
2020/04/20 Python
解决pyinstaller打包运行程序时出现缺少plotly库问题
2020/06/02 Python
Python 创建TCP服务器的方法
2020/07/28 Python
python Matplotlib基础--如何添加文本和标注
2021/01/26 Python
利用Storage Event实现页面间通信的示例代码
2018/07/26 HTML / CSS
阿玛瑞酒店中文官方网站:Amari.com
2018/02/13 全球购物
宝拉珍选英国官网:Paula’s Choice英国
2019/05/29 全球购物
市场营销专业个人自荐信格式
2013/09/21 职场文书
家居设计专业个人自荐信范文
2013/11/26 职场文书
食品销售计划书
2014/04/26 职场文书
学校读书活动总结
2014/06/30 职场文书
python中字符串String及其常见操作指南(方法、函数)
2022/04/06 Python