详谈js使用in和hasOwnProperty获取对象属性的区别


Posted in Javascript onApril 25, 2017

in判断的是对象的所有属性,包括对象实例及其原型的属性;

而hasOwnProperty则是判断对象实例的是否具有某个属性。

示例代码:

<script type="text/javascript">
  function Person(){
    }
    Person.prototype.name = "allen";

    var person = new Person();
    console.log(person.hasOwnProperty("name")); //false
    console.log("name" in person); //true
    console.log(person.name); //"allen"

    person.name = "justforse";
    console.log(person.hasOwnProperty("name")); //true
    console.log("name" in person); //true
    console.log(person.name); //"justforuse"

    delete person.name;
    console.log(person.hasOwnProperty("name")); //false
    console.log("name" in person); //true
    console.log(person.name); //"allen"
</script>

以上代码执行的时候,name属性要么是从实例中获取的,要么是来源于原型,所以使用in 来访问 name属性始终返回true;而hasOwnProperty()只在属性存在与对象实例中时才返回true,当删除了实例中的name属性后,就恢复了原型中name属性的连接,所以返回allen。

以上这篇详谈js使用in和hasOwnProperty获取对象属性的区别就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Domino中运用jQuery读取视图内容的方法
Oct 21 Javascript
javascript cookies操作集合
Apr 12 Javascript
用JS控制回车事件的代码
Feb 20 Javascript
jquery ajax同步异步的执行最终解决方案
Apr 26 Javascript
Function.prototype.bind用法示例
Sep 16 Javascript
做好七件事帮你提升jQuery的性能
Feb 06 Javascript
在JavaScript中使用对数Math.log()方法的教程
Jun 15 Javascript
vue实现动态数据绑定
Apr 28 Javascript
jQuery日期范围选择器附源码下载
May 23 jQuery
解决layui轮播图有数据不显示的情况
Sep 16 Javascript
openLayer4实现动态改变标注图标
Aug 17 Javascript
Vue页面渲染中key的应用实例教程
Jan 12 Vue.js
3分钟掌握常用的JS操作JSON方法总结
Apr 25 #Javascript
vue.js父组件使用外部对象的方法示例
Apr 25 #Javascript
ES6学习笔记之正则表达式和字符串正则方法分析
Apr 25 #Javascript
Javascript中类式继承和原型式继承的实现方法和区别之处
Apr 25 #Javascript
整理一些最近经常遇到的前端面试题
Apr 25 #Javascript
Vue.js 2.0学习教程之从基础到组件详解
Apr 24 #Javascript
js实现延迟加载的几种方法
Apr 24 #Javascript
You might like
Thinkphp多文件上传实现方法
2014/10/31 PHP
php判断文件夹是否存在不存在则创建
2015/04/09 PHP
php微信开发之谷歌测距
2018/06/14 PHP
PHP实现的DES加密解密类定义与用法示例
2020/11/02 PHP
Mac下关于PHP环境和扩展的安装详解
2019/10/17 PHP
window.showModalDialog使用手册
2007/01/11 Javascript
node.js中的path.basename方法使用说明
2014/12/09 Javascript
JavaScript中通过prototype属性共享属性和方法的技巧实例
2015/03/13 Javascript
js实现select二级联动下拉菜单
2020/04/17 Javascript
JavaScript手机振动API
2016/06/11 Javascript
基于JavaScript代码实现自动生成表格
2016/06/15 Javascript
jquery实现上传文件大小类型的验证例子(推荐)
2016/06/25 Javascript
easyUI combobox实现联动效果
2017/01/17 Javascript
详解JavaScript中this的指向问题
2017/01/20 Javascript
vue-resource 拦截器使用详解
2017/02/21 Javascript
AngularJS实现自定义指令及指令配置项的方法
2017/11/20 Javascript
js实现京东秒杀倒计时功能
2019/01/21 Javascript
Vue 组件的挂载与父子组件的传值实例
2020/09/02 Javascript
原生js实现购物车功能
2020/09/23 Javascript
Python 变量类型及命名规则介绍
2013/06/08 Python
Pandas过滤dataframe中包含特定字符串的数据方法
2018/11/07 Python
Django实现学生管理系统
2019/02/26 Python
pyqt5利用pyqtDesigner实现登录界面
2019/03/28 Python
使用Python三角函数公式计算三角形的夹角案例
2020/04/15 Python
CSS3 icon font完全指南(CSS3 font 会取代icon图标)
2013/01/06 HTML / CSS
纽约香氛品牌:NEST Fragrance
2018/10/15 全球购物
Blue Nile蓝色尼罗河香港官网:世界最大在线钻石珠宝销售商
2020/05/07 全球购物
计算机应用与科学个人的自我评价
2013/11/15 职场文书
视光学毕业生自荐书范文
2014/02/13 职场文书
就业推荐表自我鉴定范文
2014/03/21 职场文书
新春文艺演出主持词
2014/03/27 职场文书
授权委托书(公民个人适用)
2014/09/19 职场文书
教师群众路线剖析材料
2014/09/29 职场文书
《山中访友》教学反思
2016/02/24 职场文书
自从在 IDEA 中用了热部署神器 JRebel 之后,开发效率提升了 10(真棒)
2021/06/26 Java/Android
HTTP中的Content-type详解
2022/01/18 HTML / CSS