Object.keys 返回一个所有元素为字符串的数组,其元素来自于从给定的object上面可直接枚举的属性。这些属性的顺序与手动遍历该对象属性时的一致。
例如:
let obj = {
name: 'haha',
age: 20,
showName: function () {}
}
Object.keys(obj) //['name','age','showName']
处理数组时,返回数组各元素的索引值:
let arr = ['a', 'b', 'c']
Object.keys(arr)// ['0', '1', '2']
let brr = [1, 3, 4]
Object.keys(brr)// ['0', '1', '2']
可自动排序:
let arr = { 100: 'a', 2: 'b', 7: 'c' }
console.log(Object.keys(arr))// console: ['2', '7', '100']
组合用法:
let obj = {
name: 'haha',
age: 20,
}
Object.keys(obj).map((val, index)=>{
obj[val] // 可以针对obj的不同属性做不同处理
})
Object.values()
Object.values()方法返回一个给定对象自身的所有可枚举属性值的数组,值的顺序与使用for...in循环的顺序相同 ( 区别在于 for-in 循环枚举原型链中的属性 )。
例如:
let obj = {
name: 'haha',
age: 20,
showName: function () {}
}
Object.values(obj) //['haha','20', f]
let brr = [1, 3, 4]
Object.values(brr)// [1, 3, 4]
排序:
let an_obj = { 100: 'a', 2: 'b', 7: 'c' }
console.log(Object.values(an_obj))// ['b', 'c', 'a']
字符串:
console.log(Object.values('haha'))// ['h', 'a', 'h', 'a']
Object.entries()
Object.entries()方法返回一个给定对象自身可枚举属性的键值对数组,其排列与使用 for...in 循环遍历该对象时返回的顺序一致(区别在于 for-in 循环也枚举原型链中的属性)。
const obj = { foo: 'bar', baz: 42 }
console.log(Object.entries(obj))// [ ['foo', 'bar'], ['baz', 42] ]
const anObj = { 100: 'a', 2: 'b', 7: 'c' }
console.log(Object.entries(anObj))// [ ['2', 'b'], ['7', 'c'], ['100', 'a'] ]
非对象会被强制转为对象:
console.log(Object.entries('foo'))// [ ['0', 'f'], ['1', 'o'], ['2', 'o'] ]
更优雅的遍历对象键值:
const obj = { a: 5, b: 7, c: 9 }
for (const [key, value] of Object.entries(obj)) {
console.log(`${key} ${value}`)// "a 5", "b 7", "c 9"
}
// 或者
Object.entries(obj).forEach(([key, value]) =>{
console.log(`${key} ${value}`)// "a 5", "b 7", "c 9"
})
Object.fromEntries()
Object.fromEntries() 把键值对列表转换为一个对象。改方法为ES10方法, Chrome不支持
const arr = [ ['0', 'a'], ['1', 'b'], ['2', 'c'] ]
const obj = Object.fromEntries(arr)
console.log(obj)// { 0: "a", 1: "b", 2: "c" }
•object 类型:◦ 创建方式:
/*new 操作符后面Object构造函数*/ var person = new Object()person.name = "lpove"person.age = 21/*或者用对象字面量的方法*/ var person = { name: "lpove"age : 21}
•array类型
◦ 创建方式:
`var colors = new Array(“red”,”blue”,”yellow”)
• 区别和不解
◦ 比如有一个数组a=[1,2,3,4],还有一个对象a={0:1,1:2,2:3,3:4},然后你运行alert(a[1]),两种情况下的运行结果是相同的!这就是说,数据集合既可以用数组表示,也可以用对象表示,那么我到底该用哪一种呢?
我后来才知道,数组表示有序数据的集合,而对象表示无序数据的集合。如果数据的顺序很重要,就用数组,否则就用对象。
当然,数组和对象的另一个区别是,数组的数据没有”名称”(name),对象的数据有”名称”(name)。
但是问题是,很多编程语言中,都有一种叫做”关联数组”(associative array)的东西。这种数组中的数据是有名称的。
• 但是在《javascript DOM》中,不推荐我们使用 关联数组;
◦ 关联数组:
var lpove = Array()lpove[name] = "lei"lpove[age] = 21lpove[living] = true/*对象构造*/ var lpove = Object()lpove.name = "lei"lpove.age = 21lpove.living = true
因为在本质上你创建的关联数组的性质就是Array对象的属性