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库还是自己写代码?
Jan 28 Javascript
基于jquery的无刷新分页技术
Jun 11 Javascript
js 连接数据库如何操作数据库中的数据
Nov 23 Javascript
js 获取class的元素的方法 以及创建方法getElementsByClassName
Mar 11 Javascript
浅析jQuery 3.0中的Data
Jun 14 Javascript
Jquery获取当前城市的天气信息
Aug 05 Javascript
JS异步文件分片断点上传的实现思路
Dec 25 Javascript
jquery实现左右滑动式轮播图
Mar 02 Javascript
jQuery实现点击关注和取消功能
Jul 03 jQuery
angularjs 获取默认选中的单选按钮的value方法
Feb 28 Javascript
在react项目中使用antd的form组件,动态设置input框的值
Oct 24 Javascript
JS代码实现页面切换效果
Jan 10 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
基于MySQL到MongoDB简易对照表的详解
2013/06/03 PHP
Highslide.js是一款基于js实现的网页中图片展示插件
2020/03/30 Javascript
dreamweaver 安装Jquery智能提示
2011/04/02 Javascript
JavaScript判断变量是否为undefined的两种写法区别
2013/12/04 Javascript
JavaScript修改浏览器tab标题小技巧
2015/01/06 Javascript
JavaScript实现单击下拉框选择直接跳转页面的方法
2015/07/02 Javascript
drag-and-drop实现图片浏览器预览
2015/08/06 Javascript
整理Javascript数组学习笔记
2015/11/29 Javascript
js贪吃蛇游戏实现思路和源码
2016/04/14 Javascript
Angular ng-class详解及实例代码
2016/09/19 Javascript
一个非常好用的文字滚动的案例,鼠标悬浮可暂停[两种方案任选]
2016/12/01 Javascript
浅谈html转义及防止javascript注入攻击的方法
2016/12/04 Javascript
Javascript中的神器——Promise
2017/02/08 Javascript
jQuery实用密码强度检测
2017/03/02 Javascript
vue.js删除动态绑定的radio的指定项
2017/06/02 Javascript
微信小程序自动客服功能
2017/11/02 Javascript
使用Vue-cli 3.0搭建Vue项目的方法
2018/06/07 Javascript
Nodejs中使用puppeteer控制浏览器中视频播放功能
2019/08/26 NodeJs
详解Vue的组件中data选项为什么必须是函数
2020/08/17 Javascript
vue中后端做Excel导出功能返回数据流前端的处理操作
2020/09/08 Javascript
详解基于element的区间选择组件校验(交易金额)
2021/01/07 Javascript
通过代码实例展示Python中列表生成式的用法
2015/03/31 Python
Python 出现错误TypeError: ‘NoneType’ object is not iterable解决办法
2017/01/12 Python
python一键升级所有pip package的方法
2017/01/16 Python
win10从零安装配置pytorch全过程图文详解
2020/05/08 Python
介绍一下SQL注入攻击的种类和防范手段
2012/02/18 面试题
机关办公室岗位职责
2014/04/16 职场文书
国际经济贸易专业自荐信
2014/06/13 职场文书
党支部活动策划方案
2014/08/18 职场文书
酒店餐厅2014重阳节活动策划方案
2014/09/16 职场文书
整改落实自查报告
2014/11/05 职场文书
会议开幕致辞怎么写
2016/03/03 职场文书
Java基于字符界面的简易收银台
2021/06/26 Java/Android
「回转企鹅罐」10周年纪念展「輪るピングドラム展」海报公开
2022/03/22 日漫
Windows10安装Apache2.4的方法步骤
2022/06/25 Servers
Windows7下FTP搭建图文教程
2022/08/05 Servers