Seven ways to traverse objects in JS

一、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 can be enumerated only by using enumerable:true. The default enumerable:false cannot be enumerated.

2. In fact for...in, the characteristics will cause a problem, the inherited properties will be traversed, so when we don't want to traverse the inherited properties, then we can useObject.keys()

`二、Object.keys()`

You can traverse all enumerable properties of the object itself, but its return value is an array

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

}

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

1.Object.defineProperty can be enumerated only by using enumerable:true. The default enumerable:false cannot be enumerated.

Object.keys()to replace for...inthe traversal operation

`三、Object.values()`

You can traverse all the enumerable property values of the object itself, but its return value is an array

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 can be enumerated only by using enumerable:true. The default enumerable:false cannot be enumerated.

`四、Object.entries()`

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

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

}

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

Its traversal properties are the same Object.values()asObject.keys()

1.Object.defineProperty can be enumerated only by using enumerable:true. The default enumerable:false cannot be enumerated.

五、Object.getOwnPropertyNames()

Its return result Object.keys()corresponds to that of

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

Declare an empty array, use Object.getOwnPropertyNames()the method, return length, and the length attribute enumerableisfalse

六、Object.getOwnPropertySymbols()

Returns all properties in the object Symbol, and the return form is still an array. It is worth noting that when the object is initialized, it will not contain any Symbolproperties inside

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

Initialize an object. This method returns an empty array.

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

Create a new one symbol, then add it to the declared object, and get it through traversalSymbol()

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)

It can be seen that in the object, all attribute values containing the Symol attribute can be obtained

Seven, Reflect.ownKeys()

What is returned is a hodgepodge array, which contains all the properties of the object, no matter whether it is enumerable or the property is a symbol, or inherited, all properties are returned

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

What is returned is the array index and lengthattributes.