Zamiana obiektu {} na tablice []

W języku JavaScript często spotykamy się z potrzebą wyciągnięcia kluczy, wartości lub ich par z obiektu. Istnieją różne podejścia do tego zadania, w tym użycie pętli for...in oraz metod związanych z opcją Object. W tym artykule omówimy oba te sposoby i porównamy ich funkcjonalność.

Pętla "for...in" - tradycyjne podejście

Pierwszym sposobem na wyciągnięcie kluczy, wartości lub par klucz-wartość z obiektu jest użycie pętli for...in. Poniżej przedstawiamy przykład użycia tej pętli do wyciągnięcia kluczy z obiektu:

const user = {
  name: "John",
  age: 30,
  email: "john@example.com"
};

for (let key in user) {
  console.log(key);
}

W powyższym kodzie iterujemy przez każdy klucz w obiekcie "user" za pomocą pętli "for...in". Dla każdego klucza, wyświetlamy go w konsoli. W efekcie otrzymamy następujący wynik:

name
age
email

Jest to tradycyjne podejście, które może być przydatne w niektórych sytuacjach. Jednak istnieje bardziej nowoczesne rozwiązanie, które oferuje opcja Object.

Metody związane z obiektem

Object dostarcza nam trzy przydatne metody do wyciągania kluczy, wartości i par klucz-wartość z obiektu: Object.keys(), Object.values() i Object.entries(). Poniżej przedstawiamy ich przykłady użycia:

Wyciąganie kluczy za pomocą Object.keys()

const user = {
  name: "John",
  age: 30,
  email: "john@example.com"
};

const userKeys = Object.keys(user);

console.log(userKeys);

Kod powyżej używa metody Object.keys(), która zwraca tablicę zawierającą wszystkie klucze z obiektu "user". W wyniku otrzymamy następującą tablicę: ["name", "age", "email"].

Masz dosyć czytania? Obejrzyj ten filmik, w którym Wojtek wytłumaczy Ci to wszystko szybko i prosto.

Wyświetl ten post na Instagramie

Post udostępniony przez Ragnarson (@ragnarsoncom)

Wyciąganie wartości za pomocą Object.values()

const user = {
  name: "John",
  age: 30,
  email: "john@example.com"
};

const userValues = Object.values(user);

console.log(userValues);

Metoda Object.values() pozwala nam uzyskać tablicę zawierającą wszystkie wartości z obiektu "user". Wynik tego kodu będzie wyglądał tak: ["John", 30, "john@example.com"].

Wyciąganie par klucz-wartość za pomocą Object.entries()

const user = {
  name: "John",
  age: 30,
  email: "john@example.com"
};

const userKeysValues = Object.entries(user);

console.log(userKeysValues);

W przypadku użycia metody Object.entries(), otrzymamy tablicę, która zawiera pary klucz-wartość dla każdego elementu obiektu "user". Wynik będzie wyglądał następująco:

[  ["name", "John"],
  ["age", 30],
  ["email", "john@example.com"]
]

Podsumowanie

Wyciąganie kluczy, wartości i par klucz-wartość z obiektu w języku JavaScript może być zrealizowane na kilka sposobów. Tradycyjnym podejściem jest użycie pętli "for...in", której zadaniem jest iterowanie przez klucze obiektu. Jednak lepszym rozwiązaniem są metody związane z obiektem Object. Metody Object.keys(), Object.values() i Object.entries() pozwalają nam szybko i wygodnie uzyskać klucze, wartości lub pary klucz-wartość z obiektu. Dzięki nim nasz kod staje się bardziej czytelny i łatwiejszy do zrozumienia.