文章目录

Object.values()
Object.entries()
Object.getOwnPropertyDescriptors()

ES8之前获取对象的每个属性的value值：

const obj = {name: 'xiaoming',course: 'es'
}
console.log(Object.keys(obj))
const res = Object.keys(obj).map(key => obj[key])
console.log(res)
// ["xiaoming", "es"]

ES8中对象扩展补充了两个静态方法，用于遍历对象：Object.values()，Object.entries()

Object.values()

Object.values() 返回一个数组，其元素是在对象上找到的可枚举属性值。属性的顺序与通过手动循环对象的属性值所给出的顺序相同。（for...in还会遍历原型上的属性值）

const obj = {name: 'xiaoming',course: 'es'
}
console.log(Object.values(obj))
// ["xiaoming", "es"]

Object.values 是在对象上找到可枚举的属性的值，所以只要这个对象是可枚举的就可以，不只是{}这种形式。

Object.entries()

Object.entries() 方法返回一个给定对象自身可枚举属性的键值对数组，其排列与使用for...in循环遍历该对象时返回的顺序一致。（区别在于 for-in 循环也枚举原型链中的属性）

我们知道 Object 是不可直接遍历的，如果使用Object.entries()则可以完成遍历任务。

let xiaoming = {'name': 'xiaoming','age': 18,'addr': 'China'
}for (let [k, v] of Object.entries(xiaoming)) {console.log(k, v)
}
// name,xiaoming
// age,18
// addr,China

Object.entries() 返回的是个数组，里面包含了[key,value]的数据，这里也用了解构赋值的方式。

Object.getOwnPropertyDescriptors()

defineProperty 的第三个参数就是描述符(descriptor)。这个描述符包括几个属性：

value [属性的值]
writable [属性的值是否可被改变]
enumerable [属性的值是否可被枚举]
configurable [描述符本身是否可被修改，属性是否可被删除]

const data = {zhangsan: 60,lisi: 88,wangwu: 90
}
// 设置 lisi 不可枚举
Object.defineProperty(data, 'lisi', {enumerable: false
})Object.entries(data).map(([city, temp]) => {console.log(city, temp)
})
// zhangsan,60
// wangwu,90// 获取对象指定属性的描述符
console.log(Object.getOwnPropertyDescriptor(data, 'lisi'))
// {"value":88,"writable":true,"enumerable":false,"configurable":true}// 获取对象所有属性的描述符 （getOwnPropertyDescriptors  多了一个s）
console.log(Object.getOwnPropertyDescriptors(data))
// {//   "zhangsan":{"value":60,"writable":true,"enumerable":true,"configurable":true},
//   "lisi":{"value":88,"writable":true,"enumerable":false,"configurable":true},
//   "wangwu":{"value":90,"writable":true,"enumerable":true,"configurable":true}
// }

【ES8(2017)】Object 扩展 values() / entries() / getOwnPropertyDescriptors()相关推荐

Macbook pro 2016/2017 接入扩展坞时断 WIFI 问题的解决办法
Macbook pro 2016/2017 接入扩展坞时断 WIFI 问题的解决办法参考文章: (1)Macbook pro 2016/2017 接入扩展坞时断 WIFI 问题的解决办法 (2)ht ...
【ES8(2017)】String扩展 padStart / padEnd
文章目录 1. String.prototype.padStart() 2. String.prototype.padEnd() 1. String.prototype.padStart() 把指定字 ...
【ES8(2017)】async / await
async 和 await 是一种更加优雅的异步编程解决方案,是Promise 的拓展. 在我们处理异步的时候,比起回调函数,Promise的then方法会显得较为简洁和清晰,但是在处理多个彼此之间相 ...
ES6, ES7, ES8, ES9 以及 ES10 新特征
目录 1. ES6 新特征 (2015) 1.1 module 1.1.1 export 1.1.2 import 1.2 Arrow function (箭头函数) 1.2.1 箭头函数结构 1. ...
前端面试题集锦——JavaScript
前端面试题集锦--JavaScript 1.请你谈谈 Cookie 的优缺点 cookie是存储于访问者计算机中的变量 cookie是浏览器提供的一种机制可以由JavaScript对其进行控制(设置 ...
Es6学习回顾（非完整版）
本文章主要是基于尚硅谷(https://www.bilibili.com/video/BV1uK411H7on?p=14)讲的知识点中不熟悉的部分进行快速回顾参考文章:https://es6.rua ...
现代JavaScript教程---笔记---js部分
github地址:-js-/笔记.md at master · xiaochuanbbd/-js- · GitHub 教程地址:现代 JavaScript 教程转数字: NaN的情况: undefi ...
工作中常用的前端知识总结
1.使用css写出一个三角形角标元素宽高设置为0,通过border属性来设置,让其它三个方向的border颜色为透明或者和背景色保持一致,剩余一条border的颜色设置为需要的颜色. div {wi ...

【ES8(2017)】Object 扩展 values() / entries() / getOwnPropertyDescriptors()

文章目录

Object.values()

Object.entries()

Object.getOwnPropertyDescriptors()

【ES8(2017)】Object 扩展 values() / entries() / getOwnPropertyDescriptors()相关推荐

最新文章

热门文章