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 相关文章推荐
jquery 漂亮的删除确认和提交无刷新删除示例
Nov 13 Javascript
javascript模拟post提交隐藏地址栏的参数
Sep 03 Javascript
js性能优化技巧
Nov 29 Javascript
使用jQuery或者原生js实现鼠标滚动加载页面新数据
Mar 06 Javascript
jQuery EasyUI提交表单验证
Jul 19 Javascript
webix+springmvc session超时跳转登录页面
Oct 30 Javascript
JavaScript制作简易计算器(不用eval)
Feb 05 Javascript
详谈js使用in和hasOwnProperty获取对象属性的区别
Apr 25 Javascript
Vue框架之goods组件开发详解
Jan 25 Javascript
跨域解决之JSONP和CORS的详细介绍
Nov 21 Javascript
如何使用 vue + d3 画一棵树
Dec 03 Javascript
JavaScript实现模态对话框实例
Jan 13 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 socket(fsockopen)的应用实例分析
2013/06/02 PHP
typecho插件编写教程(三):保存配置
2015/05/28 PHP
纯PHP代码实现支付宝批量付款
2015/12/24 PHP
php中时间函数date及常用的时间计算
2017/05/12 PHP
PHP区块查询实现方法分析
2018/05/12 PHP
javascript动态添加表格数据行(ASP后台数据库保存例子)
2010/05/08 Javascript
Javascript 面向对象编程(一) 封装
2011/08/28 Javascript
JavaScript实现删除,移动和复制文件的方法
2015/08/05 Javascript
javascript 实现动态侧边栏实例详解
2016/11/11 Javascript
微信小程序开发之大转盘 仿天猫超市抽奖实例
2016/12/08 Javascript
Bootstrap 手风琴菜单的实现代码
2017/01/20 Javascript
基于vue+ bootstrap实现图片上传图片展示功能
2017/05/17 Javascript
解决BootStrap Fileinput手机图片上传显示旋转问题
2017/06/01 Javascript
pm2 部署 node的三种方法示例
2017/10/20 Javascript
微信小程序 点击切换样式scroll-view实现代码实例
2019/10/11 Javascript
springboot+vue+对接支付宝接口+二维码扫描支付功能(沙箱环境)
2020/10/15 Javascript
[54:06]OG vs TNC 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
[02:50]【扭转乾坤,只此一招】DOTA2全新版本永雾林渊开启新篇章
2020/12/24 DOTA
python通过smpt发送邮件的方法
2015/04/30 Python
Python基于socket模块实现UDP通信功能示例
2018/04/10 Python
对python 匹配字符串开头和结尾的方法详解
2018/10/27 Python
python实现键盘输入的实操方法
2019/07/16 Python
浅析Python语言自带的数据结构有哪些
2019/08/27 Python
美国现代家具购物网站:LexMod
2019/01/09 全球购物
ajax是什么及其工作原理
2012/02/08 面试题
幼儿园毕业寄语
2014/04/03 职场文书
英语求职信范文
2014/05/23 职场文书
观看信仰心得体会
2014/09/04 职场文书
工厂见习报告范文
2014/10/31 职场文书
中英文求职信范文
2015/03/19 职场文书
教师节简报
2015/07/20 职场文书
驾驶员管理制度范本
2015/08/06 职场文书
2016年“12.3”国际残疾人日活动总结
2016/04/01 职场文书
闭幕词的写作格式与范文!
2019/06/24 职场文书
解决hive中导入text文件遇到的坑
2021/04/07 Python
SQL IDENTITY_INSERT作用案例详解
2021/08/23 MySQL