012 JS遍历对象的7中方法

50 阅读2分钟

JS遍历对象的7中方法

1. 属性的可枚举性

enumerable: 可枚举的

let obj = {
    name: '举案齐眉',
    age: '18'
}
Object.getOwnPropertyDescriptor(obj,"name")

2. 遍历对象

**for...in**可以遍历对象的所有可枚举属性,包括对象本身的和对象继承来的属性。

let obj = {
    name: "Jack",
    like: "girl"
}

Object.defineProperty(obj, 'age', {
    value: '18',
    enumerable: false
})
for(key in obj) {
	console.log(key)  // name like
	console.log(obj[key])  // Jack girl
}

上面的例子中,使用Object.defineProperty 的形式来设置对象的描述对象,将其可枚举属性值设置为false,使用for...in遍历,其实没有被打印出来。

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

3. Object.keys()

Object.keys()方法可以遍历到所有对象本身的可枚举的属性,但是其返回值为数组。

let obj = {
    name:'Jack',
    like: 'girl',
}
Object.keys(obj) // ['name','like']

我们一般是使用Object.keys()来代替for...in遍历操作,为了代替for...in,又新增了与Object.keys()配套的遍历方法。

4. Object.values()

Object.values()Object.keys()遍历对象的特性是相同的,但是其返回的结构是遍历的属性值构成的数组。

let obj = {
    name: 'jack',
    age: '18'
}
Object.values(obj) // ['jack', '18']
Object.defineProperty(obj,'like', {
    value: 'coding',
    enumerable: false
})
Object.values(obj) // ['jack', '18']

声明了一个对象,使用Object.values()返回对象的所有自身可枚举属性的属性值,通过设置新的属性值并将其描述对象内的 enumerable设置为false,就可以看到Object.values()的特性。

5. Object.entries()

entries: 条目

Object.entries()的返回值为Object.values()Object.keys()的结合,也就是说它会返回一个嵌套数组,数组内包括了属性名与属性值。

let obj = {
    name: 'jack',
    age: 18
}
Object.entries(obj)  // [['name', 'age'],['jack', 18]]

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

6. Object.getOwnPropertyNames()

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

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

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

7. Object.getOwnPropertySymbols()

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

属性

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

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

let sym = Symbol()
console.log(sym)
obj[sym] = 'dogs'
Object.getOwnPropertySymbols(obj)  // Symbol()

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

8. Reflect.ownKeys()

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

let arr = [0, 31, 2]
Reflect.ownkeys(arr)  // ['0','1', '2', 'length']
// 声明了一个数组,返回的是数组下标和length属性