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 相关文章推荐
跨浏览器开发经验总结(三)   警惕“IE依赖综合症”
May 13 Javascript
自用js开发框架小成 学习js的朋友可以看看
Nov 16 Javascript
javascript中不等于的代码是什么怎么写
Dec 29 Javascript
jQuery的Read()方法代替原生JS详解
Nov 08 Javascript
基于jQuery实现照片墙自动播放特效
Jan 12 Javascript
Vuex实现计数器以及列表展示效果
Mar 10 Javascript
使用Angular CLI生成 Angular 5项目教程详解
Mar 18 Javascript
用ES6写全屏滚动插件的示例代码
May 02 Javascript
小程序红包雨的实现示例
Feb 19 Javascript
Vue3 中的数据侦测的实现
Oct 09 Javascript
vue+node 实现视频在线播放的实例代码
Oct 19 Javascript
为什么node.js不适合大型项目
Apr 28 Javascript
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配合fiddler抓包抓取微信指数小程序数据的实现方法分析
2020/01/02 PHP
基于javascript实现的搜索时自动提示功能
2014/12/26 Javascript
实现无刷新联动例子汇总
2015/05/20 Javascript
微信浏览器内置JavaScript对象WeixinJSBridge使用实例
2015/05/25 Javascript
详解js中class的多种函数封装方法
2016/01/03 Javascript
js控制台输出的方法(详解)
2016/11/26 Javascript
JavaScript给每一个li节点绑定点击事件的实现方法
2016/12/01 Javascript
bootstrap网格系统使用方法解析
2017/01/13 Javascript
JavaScript中匿名函数的递归调用
2017/01/22 Javascript
nodejs连接mysql数据库简单封装示例-mysql模块
2017/04/10 NodeJs
AngularJS+bootstrap实现动态选择商品功能示例
2017/05/17 Javascript
JS实现的base64加密解密操作示例
2018/04/18 Javascript
vue 返回上一页,页面样式错乱的解决
2019/11/14 Javascript
jquery实现垂直手风琴菜单
2020/03/04 jQuery
[36:22]VP vs Serenity 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
[01:18]PWL开团时刻DAY10——一拳超人
2020/11/11 DOTA
python开发的小球完全弹性碰撞游戏代码
2013/10/15 Python
python返回昨天日期的方法
2015/05/13 Python
python 添加用户设置密码并发邮件给root用户
2016/07/25 Python
Python中logging.NullHandler 的使用教程
2018/11/29 Python
pandas 层次化索引的实现方法
2019/07/06 Python
简单了解python关系(比较)运算符
2019/07/08 Python
pytorch 自定义数据集加载方法
2019/08/18 Python
python多线程案例之多任务copy文件完整实例
2019/10/29 Python
Python3 main函数使用sys.argv传入多个参数的实现
2019/12/25 Python
Pytorch释放显存占用方式
2020/01/13 Python
Python单链表原理与实现方法详解
2020/02/22 Python
利用matplotlib为图片上添加触发事件进行交互
2020/04/23 Python
python有几个版本
2020/06/17 Python
python 基于opencv 绘制图像轮廓
2020/12/11 Python
生物化工工艺专业应届生求职信
2013/10/08 职场文书
儿子婚宴答谢词
2014/01/09 职场文书
横幅标语大全
2014/06/17 职场文书
怎样写工作总结啊!
2019/06/18 职场文书
Redis做数据持久化的解决方案及底层原理
2021/07/15 Redis
公历12个月名称的由来
2022/04/12 杂记