JS遍历对象的七种方法

本文介绍了JavaScript中for...in、Object.keys()、Object.values()、Object.entries()、Object.getOwnPropertyNames()、Object.getOwnPropertySymbols()以及Reflect.ownKeys()等方法,详细讲解了它们在遍历对象属性时的不同特性和应用场景。
摘要由CSDN通过智能技术生成

一、for...in

let obj ={
name:"cheng",
sex:'man'

}
Object.defineProperty(obj,'age',{
    value:"18",
    enumerable:true
})
for(item in obj){
    console.log(item)
}

1.Object.defineProperty,使用enumerable:true,才能被枚举,默认enumerable:false不可被枚举

2.其实for...in的特性会导致一个问题,其继承的属性会被遍历到,所以当我们不想要遍历被继承的属性,那么我们就可以使用Object.keys()

二、Object.keys()

可以遍历到所有对象本身的可枚举属性,但是其返回值为数组

let obj ={
name:"cheng",
sex:'man'

}

Object.keys(obj)//['name','sex']

1.Object.defineProperty,使用enumerable:true,才能被枚举,默认enumerable:false不可被枚举

Object.keys()来代替for...in遍历操作

三、Object.values()

可以遍历到所有对象本身的可枚举属性值,但是其返回值为数组

let obj ={
name:"cheng",
sex:'man'

}

Object.values(obj) // ['cheng', ‘man’]
Object.defineProperty(obj, 'sex', {
  value: "666",
  enumerable: false
});
Object.values(obj) // ['cheng', ‘man’]

1.Object.defineProperty,使用enumerable:true,才能被枚举,默认enumerable:false不可被枚举

四、Object.entries()

返回值为Object.values()与Object.keys()的结合,返回一个二维数组,每个小数组都是[ [属性名,属性值],[属性名,属性值] ]

let obj ={
name:"cheng",
sex:'man'

}

Object.entries(obj) // [['name', ‘cheng’],['sex','man']]

其遍历特性与Object.values()Object.keys()相同

1.Object.defineProperty,使用enumerable:true,才能被枚举,默认enumerable:false不可被枚举

五、Object.getOwnPropertyNames()

其返回结果与Object.keys()对应,但是他得特性与其相反,会返回对象得所有属性,包括了不可枚举属性

var arr = [];
console.log(Object.getOwnPropertyNames(arr)); // ['length']
Object.getOwnPropertyDescriptor(arr,"length").enumerable // false

声明一个空数组,使用Object.getOwnPropertyNames()方法,返回了length,而length属性的enumerablefalse

六、Object.getOwnPropertySymbols()

返回对象内的所有Symbol属性,返回形式依旧是数组,值得注意的是,在对象初始化的时候,内部是不会包含任何Symbol属性

let obj = {
    name:"obj"
}
Object.getOwnPropertySymbols(obj) // []

初始化一个对象,通过这个方法返回的是一个空数组

let sym = Symbol()
console.log(sym)
obj[sym] = "cheng" 
Object.getOwnPropertySymbols(obj) // Symbol()

 新建symbol,再为声明好的对象添加进去,通过遍历得到Symbol()

var obj = {};
var a = Symbol("a");
var b = Symbol.for("b");

obj[a] = "localSymbol";
obj[b] = "globalSymbol";

var objectSymbols = Object.getOwnPropertySymbols(obj);

console.log(objectSymbols.length); // 2
console.log(objectSymbols) // [Symbol(a), Symbol(b)]
console.log(objectSymbols[0]) // Symbol(a)

可以看出,可以得到对象中,可以获取包含Symol属性的所有的属性值

七、Reflect.ownKeys()

返回的是一个大杂烩数组,即包含了对象的所有属性,无论是否可枚举还是属性是symbol,还是继承,将所有的属性返回

let arr = [0,66,222]
Reflect.ownKeys(arr) // ['0', '1', '2', 'length']

返回的是数组下标和length属性。

根据遍历目标区分

根据返回值区分

根据遍历值区分

写文章

热门文章

  • JS遍历对象的七种方法 20973
  • 解决微云下载限速问题 20608
  • 为硬件保留的存储空间怎么释放出来? 14185
  • js之日期函数Date 10118
  • js之正则表达式 9979

最新评论

  • vue运行报错问题error Command failed with exit code 1.

    sout_ok: 现在有更好的解决办法了吗

  • vue 路由跳转到其他页面指定位置(锚点)

    weixin_37076838: 非常感谢您的分享,解决了我的问题

  • $ref赋值之后,子组件不渲染(刷新后,$ref父组件传值,子组件不更新数据问题)

    会玩代码的猫: 嗯嗯,当时确实有用,我现在也不用这个方式了,这不算是正道

  • $ref赋值之后,子组件不渲染(刷新后,$ref父组件传值,子组件不更新数据问题)

    夏垣: 试了,没有用,最后我选择直接用provide传值了

  • 解决Vue.js not detected的问题(Vue.js devtools变灰色)

    Tiamozoy: 谢谢

最新文章

  • Cannot read property ‘setRules‘ of undefined“found in,u-popup u-form 规则失效问题解决方案
  • 百度崩了????
  • chunk-vendors.js:16043 Uncaught TypeError: Cannot read properties of null (reading ‘bottom‘)
2024年5篇
2023年70篇
2022年24篇
2021年3篇

目录

目录

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值

玻璃钢生产厂家四川周年庆典商场美陈费用昆明市玻璃钢雕塑加工公司广东玻璃钢广场雕塑厂家供应周口玻璃钢大型城市雕塑厂家中山商场美陈策划玻璃钢雕塑制作设计价位玻璃钢卡通雕塑奶牛定做北京通道商场美陈批发黔西南商场美陈安装佛山制作玻璃钢卡通雕塑杨浦区玻璃钢雕塑厂家直供彩色玻璃钢雕塑阳江玻璃钢动物雕塑推荐厂家福建展会玻璃钢雕塑公司福州特色玻璃钢雕塑衡阳玻璃钢花盆花器东营玻璃钢花盆江苏步行街玻璃钢雕塑优势玻璃钢仿古雕塑翻新施工工艺云浮卡通玻璃钢动物雕塑商场玻璃钢花盆设计厂家玻璃钢骆驼雕塑售价黄山五一商场美陈成都玻璃钢花盆广东商场创意商业美陈作品北京景区玻璃钢雕塑生产厂家玻璃钢仿古铜艺术雕塑生物玻璃钢雕塑宝山玻璃钢卡通雕塑新县玻璃钢雕塑费用香港通过《维护国家安全条例》两大学生合买彩票中奖一人不认账让美丽中国“从细节出发”19岁小伙救下5人后溺亡 多方发声单亲妈妈陷入热恋 14岁儿子报警汪小菲曝离婚始末遭遇山火的松茸之乡雅江山火三名扑火人员牺牲系谣言何赛飞追着代拍打萧美琴窜访捷克 外交部回应卫健委通报少年有偿捐血浆16次猝死手机成瘾是影响睡眠质量重要因素高校汽车撞人致3死16伤 司机系学生315晚会后胖东来又人满为患了小米汽车超级工厂正式揭幕中国拥有亿元资产的家庭达13.3万户周杰伦一审败诉网易男孩8年未见母亲被告知被遗忘许家印被限制高消费饲养员用铁锨驱打大熊猫被辞退男子被猫抓伤后确诊“猫抓病”特朗普无法缴纳4.54亿美元罚金倪萍分享减重40斤方法联合利华开始重组张家界的山上“长”满了韩国人?张立群任西安交通大学校长杨倩无缘巴黎奥运“重生之我在北大当嫡校长”黑马情侣提车了专访95后高颜值猪保姆考生莫言也上北大硕士复试名单了网友洛杉矶偶遇贾玲专家建议不必谈骨泥色变沉迷短剧的人就像掉进了杀猪盘奥巴马现身唐宁街 黑色着装引猜测七年后宇文玥被薅头发捞上岸事业单位女子向同事水杯投不明物质凯特王妃现身!外出购物视频曝光河南驻马店通报西平中学跳楼事件王树国卸任西安交大校长 师生送别恒大被罚41.75亿到底怎么缴男子被流浪猫绊倒 投喂者赔24万房客欠租失踪 房东直发愁西双版纳热带植物园回应蜉蝣大爆发钱人豪晒法院裁定实锤抄袭外国人感慨凌晨的中国很安全胖东来员工每周单休无小长假白宫:哈马斯三号人物被杀测试车高速逃费 小米:已补缴老人退休金被冒领16年 金额超20万

玻璃钢生产厂家 XML地图 TXT地图 虚拟主机 SEO 网站制作 网站优化