JS：遍历对象的常用方法

for...in ⭐

for...in 语句用于遍历对象属性。循环中的代码每执行一次，就会对对象的属性进行一次操作。

const a = { x: 1, y: 2, z: 3 };

for (let key in a) {
  console.log(key); // expected output: x y z
}

Object.keys() ⭐

Object.keys() 方法返回一个由给定对象的自身属性名组成的数组（仅包括可枚举属性）。

const a = { x: 1, y: 2, z: 3 };
const b = Object.keys(a);

console.log(b); // expected output: [ 'x', 'y', 'z' ]

Object.entries() ⭐

Object.entries() 方法返回一个给定对象自身属性的键值对组成的数组（仅包括可枚举属性）。

const a = { x: 1, y: 2, z: 3 };
const b = Object.entries(a)

console.log(b); // expected output: [ [ 'x', 1 ], [ 'y', 2 ], [ 'z', 3 ] ]

Object.getOwnPropertyNames()

Object.getOwnPropertyNames() 方法返回一个由给定对象的自身属性的属性名组成的数组（包括不可枚举属性）。

const a = Object.create(
  {},
  {
    // getX 是一个不可枚举属性
    getX: {
      value: () => this.x,
    },
  }
);

a.x = 1;

const b = Object.getOwnPropertyNames(a);

console.log(a); // expected output: { x: 1 }
console.log(b); // expected output: [ 'getX', 'x' ]

Object.getOwnPropertySymbols()

Object.getOwnPropertySymbols() 方法返回一个给定对象自身的所有 Symbol 属性的数组。

const a = { x: 1 };
a[Symbol("y")] = 2;
a[Symbol.for("z")] = 3;

const b = Object.getOwnPropertySymbols(a);

console.log(a); // expected putput: { x: 1, [Symbol(y)]: 2, [Symbol(z)]: 3 }
console.log(b); // expected putput: [ Symbol(y), Symbol(z) ]

Reflect.ownKeys()

Reflect.ownKeys() 方法是 ES2015 新增的静态方法，该方法返回对象自身所有属性名组成的数组，包括不可枚举的属性和 Symbol 属性。

const a = Object.create(
  {},
  {
    // getX 是一个不可枚举属性
    getX: {
      value: () => this.x,
    },
  }
);

a.x = 1;
a[Symbol("y")] = 2;

const b = Reflect.ownKeys(a);

console.log(a); // expected putput: { x: 1, [Symbol(y)]: 2 }
console.log(b); // expected putput: [ 'getX', 'x', Symbol(y) ]