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 相关文章推荐
javascript eval和JSON之间的联系
Dec 31 Javascript
jQuery中与toggleClass等价的程序段 以及未来学习的方向
Mar 18 Javascript
dotopAlert 提示用户需安装播放器的代码
Sep 17 Javascript
文本框文本自动补全效果示例分享
Jan 19 Javascript
JavaScript识别网页关键字并进行描红的方法
Nov 09 Javascript
JavaScript编写Chrome扩展实现与浏览器的交互及时间通知
May 16 Javascript
BootStrap网页中代码显示用法详解
Oct 21 Javascript
jQuery 常见小例汇总
Dec 14 Javascript
layui 表格的属性的显示转换方法
Aug 14 Javascript
微信小程序授权登陆及每次检查是否授权实例代码
Sep 18 Javascript
js实现图片跟随鼠标移动效果
Oct 16 Javascript
vue使用svg文件补充-svg放大缩小操作(使用d3.js)
Sep 22 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图片的裁剪与缩放生成符合需求的缩略图
2013/01/11 PHP
PHP+jQuery翻板抽奖功能实现
2015/10/19 PHP
PHP使用strrev翻转中文乱码问题的解决方法
2017/01/13 PHP
理解Javascript_01_理解内存分配原理分析
2010/10/11 Javascript
对javascript的一点点认识总结《javascript高级程序设计》读书笔记
2011/11/30 Javascript
Js获取下拉框选定项的值和文本的实现代码
2014/02/26 Javascript
jquery datatable后台封装数据示例代码
2014/08/07 Javascript
点击标签切换和自动切换DIV选项卡
2014/08/10 Javascript
javascript实现密码强度显示
2015/03/18 Javascript
JavaScript创建闭包的两种方式的优劣与区别分析
2015/06/22 Javascript
异步安全加载javascript文件的方法
2015/07/21 Javascript
JS代码随机生成姓名、手机号、身份证号、银行卡号
2016/04/27 Javascript
AngularJS实现数据列表的增加、删除和上移下移等功能实例
2016/09/05 Javascript
一个例子轻松学会Vue.js
2017/01/02 Javascript
Bootstrap的popover(弹出框)在append后弹不出(失效)
2017/02/27 Javascript
javascript实现循环广告条效果
2017/12/12 Javascript
Angular 4.x+Ionic3踩坑之Ionic 3.x界面传值详解
2018/03/13 Javascript
JavaScript面向对象的程序设计(犯迷糊的小羊)
2018/05/27 Javascript
vue项目中使用百度地图的方法
2018/06/08 Javascript
js实现九宫格抽奖
2020/03/19 Javascript
2020京东618叠蛋糕js脚本(亲测好用)
2020/06/02 Javascript
vue实现员工信息录入功能
2020/06/11 Javascript
Python编写百度贴吧的简单爬虫
2015/04/02 Python
Python的Django框架中if标签的相关使用
2015/07/15 Python
详解Python中 sys.argv[]的用法简明解释
2017/12/20 Python
Python 使用 PyMysql、DBUtils 创建连接池提升性能
2019/08/14 Python
Python循环实现n的全排列功能
2019/09/16 Python
基于Python中的yield表达式介绍
2019/11/19 Python
解决jupyter notebook 出现In[*]的问题
2020/04/13 Python
Python引入多个模块及包的概念过程解析
2020/09/21 Python
python 基于opencv操作摄像头
2020/12/24 Python
CSS3圆角和渐变2种常用功能详解
2016/01/06 HTML / CSS
优秀中专生推荐信
2013/11/17 职场文书
给同事的道歉信
2014/01/11 职场文书
“向国旗敬礼”主题班会活动设计方案
2014/09/27 职场文书
大学毕业谢师宴致辞
2015/07/27 职场文书