JS对象属性的检测与获取操作实例分析


Posted in Javascript onMarch 17, 2020

本文实例讲述了JS对象属性的检测与获取操作。分享给大家供大家参考,具体如下:

1.1 in运算符

in运算符用于检查对象是否包含某个属性(注意,检查的是键名,不是键值), 如果包含就返回true,否则返回false

var obj = { p: 1 }
'p' in obj // true
'toString' in obj // true

上面代码中,obj对象上有一个p属性,所以使用in运算符时,得到true,但toString并没有在obj对象上,为什么也返回true呢,这是因为in运算符,不能识别哪些属性是对象自身的,哪些是继承的。因为toString是继承自obj的原型对象,所以会返回true。

1.2 for … in 循环

for … in 循环用来遍历一个对象的全部属性。

var obj = {a: 1, b: 2, c: 3};

for (var i in obj) {
 console.log(obj[i]);
}

for … in 循环有两个使用注意点

  1. 它遍历的是对象所有可遍历的属性,会跳过不可遍历的属性。
  2. 它不仅遍历对象自身的属性,还遍历继承的属性。

如果想得到自身的属性,需要结合hasOwnProperty方法,在循环内部判断一下,某个属性是否为对象自身的属性。

var person = { name: '老张' };

for (var key in person) {
 if (person.hasOwnProperty(key)) {
  console.log(key);
 }
}

想要得到自身的属性还有另外两种方法:

es5:

利用Object.getOwnPropertyNames(obj)

var person = { name: '老张' }
var props = Object.getOwnPropertyNames(person)

es6:

利用Object.keys(obj)

var person = { name: '老张' }
var props = Object.keys(person)

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
js 实现无干扰阴影效果 简单好用(附文件下载)
Dec 27 Javascript
淘宝搜索框效果实现分析
Mar 05 Javascript
Javascript 类、命名空间、代码组织代码
Jul 31 Javascript
javascript打印大全(打印页面设置/打印预览代码)
Mar 29 Javascript
JavaScript实现多维数组的方法
Nov 20 Javascript
JavaScript程序开发之JS代码放置的位置
Jan 15 Javascript
jQuery禁用快捷键例如禁用F5刷新 禁用右键菜单等的简单实现
Aug 31 Javascript
20170918 前端开发周报之JS前端开发必看
Sep 18 Javascript
Javascript中从学习bind到实现bind的过程
Jan 05 Javascript
javascript使用正则实现去掉字符串前面的所有0
Jul 23 Javascript
node.js 模块和其下载资源的镜像设置的方法
Sep 06 Javascript
通过vue.extend实现消息提示弹框的方法记录
Jan 07 Vue.js
JS前端模块化原理与实现方法详解
Mar 17 #Javascript
javascript中innerHTML 获取或替换html内容的实现代码
Mar 17 #Javascript
Vue中keep-alive 实现后退不刷新并保持滚动位置
Mar 17 #Javascript
用js编写留言板
Mar 17 #Javascript
Vue脚手架编写试卷页面功能
Mar 17 #Javascript
基于JavaScript实现留言板功能
Mar 16 #Javascript
JS实现简易留言板(节点操作)
Mar 16 #Javascript
You might like
一个php作的文本留言本的例子(六)
2006/10/09 PHP
php使用curl模拟登录后采集页面的例子
2013/11/04 PHP
php使用strip_tags()去除html标签仍有空白的解决方法
2016/07/28 PHP
php+ajax实现异步上传文件或图片功能
2017/07/18 PHP
PHP 出现 http500 错误的解决方法
2021/03/09 PHP
模拟jQuery ajax服务器端与客户端通信的代码
2011/03/28 Javascript
一个页面放2段图片滚动代码出现冲突的问题如何解决
2012/12/21 Javascript
表单的焦点顺序tabindex和对应enter键提交
2013/01/04 Javascript
jQuery创建平滑的页面滚动(顶部或底部)
2013/02/26 Javascript
JS 对输入框进行限制(常用的都有)
2013/07/30 Javascript
JQuery中serialize()用法实例分析
2015/02/06 Javascript
详解jQuery中的元素的属性和相关操作
2015/08/14 Javascript
js 获取本地文件及目录的方法(推荐)
2016/11/10 Javascript
Nodejs 搭建简单的Web服务器详解及实例
2016/11/30 NodeJs
微信小程序 ES6Promise.all批量上传文件实现代码
2017/04/14 Javascript
JavaScript数据结构学习之数组、栈与队列
2017/05/02 Javascript
es6 字符串String的扩展(实例讲解)
2017/08/03 Javascript
async/await地狱该如何避免详解
2018/05/10 Javascript
angular的输入和输出的使用方法
2018/09/22 Javascript
详解vuejs2.0 select 动态绑定下拉框支持多选
2019/04/25 Javascript
vue实现条件叠加搜索的解决方法
2019/05/28 Javascript
微信小程序个人中心的列表控件实现代码
2020/04/26 Javascript
vue 接口请求地址前缀本地开发和线上开发设置方式
2020/08/13 Javascript
js实现电灯开关效果
2021/01/19 Javascript
在Python中移动目录结构的方法
2016/01/31 Python
Python生成任意范围任意精度的随机数方法
2018/04/09 Python
详解基于python的全局与局部序列比对的实现(DNA)
2020/10/07 Python
HTML5中使用postMessage实现两个网页间传递数据
2016/06/22 HTML / CSS
求职信模版
2013/11/30 职场文书
公司市场部岗位职责
2013/12/02 职场文书
超市营业员岗位职责
2013/12/20 职场文书
遗产继承公证书
2014/04/09 职场文书
会议通知格式范文
2015/04/15 职场文书
通知怎么写?
2019/04/17 职场文书
Python+Appium实现自动抢微信红包
2021/05/21 Python
如何用H5实现好玩的2048小游戏
2022/07/23 HTML / CSS