详谈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 相关文章推荐
21个值得收藏的Javascript技巧
Feb 04 Javascript
jQuery实现复选框全选/取消全选/反选及获得选择的值
Jun 12 Javascript
js中日期的加减法
May 06 Javascript
form表单转Json提交的方法(推荐)
Sep 23 Javascript
BootStrap中的Fontawesome 图标
May 25 Javascript
AngularJS中使用three.js的实例详解
Jul 21 Javascript
JS HTML图片显示Canvas 压缩功能
Jul 21 Javascript
微信小程序scroll-view实现滚动穿透和阻止滚动的方法
Aug 20 Javascript
在vue项目中使用md5加密的方法
Sep 14 Javascript
关于Vue Router中路由守卫的应用及在全局导航守卫中检查元字段的方法
Dec 09 Javascript
零基础之Node.js搭建API服务器的详解
Mar 08 Javascript
基于Vue SEO的四种方案(小结)
Jul 01 Javascript
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
S900/ ETON E1-XM 收音机
2021/03/02 无线电
php实现mysql封装类示例
2014/05/07 PHP
UPUPW 更新 64 位 Apache 系列 PHP 7.0 正式版
2015/12/08 PHP
php车辆违章查询数据示例
2016/10/14 PHP
Laravel 实现密码重置功能
2018/02/23 PHP
YII框架http缓存操作示例
2019/04/29 PHP
php实现对文件压缩简单的方法
2019/09/29 PHP
Extjs ajax同步请求时post方式参数发送方式
2009/08/05 Javascript
Jquery提交表单 Form.js官方插件介绍
2012/03/01 Javascript
js查错流程归纳
2012/05/04 Javascript
JS模板实现方法
2013/04/03 Javascript
Node.js实现兼容IE789的文件上传进度条
2016/09/02 Javascript
微信小程序 122100版本更新问题解决方案
2016/12/22 Javascript
纯JS实现只能输入数字的简单代码
2017/06/21 Javascript
解决vue组件中使用v-for出现告警问题及v for指令介绍
2017/11/11 Javascript
vue中前进刷新、后退缓存用户浏览数据和浏览位置的实例讲解
2018/09/21 Javascript
vue init webpack 建vue项目报错的解决方法
2018/09/29 Javascript
使用pm2自动化部署node项目的方法步骤
2019/01/28 Javascript
java和js实现的洗牌小程序
2019/09/30 Javascript
原生js实现日历效果
2020/03/02 Javascript
js实现简易ATM功能
2020/10/27 Javascript
基于vue实现微博三方登录流程解析
2020/11/04 Javascript
同时安装Python2 &amp; Python3 cmd下版本自由选择的方法
2017/12/09 Python
Python版名片管理系统
2018/11/30 Python
Pycharm在指定目录下生成文件和删除文件的实现
2020/12/28 Python
CSS3实现网站商品展示效果图
2020/01/18 HTML / CSS
美国在线自行车商店:Jenson USA
2018/05/22 全球购物
营销总经理岗位职责
2014/02/02 职场文书
作文批改评语大全
2014/04/23 职场文书
2014大学生中国梦主题教育学习思想汇报
2014/09/10 职场文书
大学生军训自我鉴定范文
2014/09/18 职场文书
2014年小学体育工作总结
2014/12/11 职场文书
少先队中队工作总结2015
2015/07/23 职场文书
幼儿园2016年感恩节活动总结
2016/04/01 职场文书
Django显示可视化图表的实践
2021/05/10 Python
HTML中实现音乐或视频自动播放案例详解
2022/05/30 HTML / CSS