JavaScript: Jak iterować po obiekcie?

Samo iterowanie po obiekcie jest dość proste. Możemy skorzystać z pętli for in:

const object = {
  foo: {
    label: 'Foo label',
    value: 1
  },
  bar: {
    label: 'Bar label',
    value: 2
  }
};

for (const key in object) {
  console.log(`key: ${key} value: `, object[key]);
}

Ale co, w przypadku gdybyśmy potrzebowali użyć funkcji operujących na tablicach? Jak na przykład: reduce lub map.

Iterowanie po obiekcie, jak po tablicy

Żeby iterować po obiekcie, jak po tablicy możemy skorzystać z metody: keys klasy Object. Przykład:

const object = {
  foo: {
    label: 'Foo label',
    value: 1
  },
  bar: {
    label: 'Bar label',
    value: 2
  }
};

const total = Object.keys(object).reduce((result, currentKey) => result + object[currentKey].value, 0);
console.log(`Total: ${total}`); // Total: 3

Metoda keys zwraca tablicę kluczy dla danego obiektu.

Jeśli nie zależy nam na dostępie do kluczy, możemy skorzystać z innej metody tej samej klasy: values. Przykład:

const object = {
  foo: {
    label: 'Foo label',
    value: 1
  },
  bar: {
    label: 'Bar label',
    value: 2
  }
};

const total = Object.values(object).reduce((result, current) => result + current.value, 0);
console.log(`Total: ${total}`); // Total: 3