6

Как перебирать объект в JavaScript?

1

У меня есть объект в JavaScript, который выглядит следующим образом:

{
    abc: '...',
    bca: '...',
    zzz: '...',
    xxx: '...',
    ccc: '...',
    // ...
}

Я хочу использовать цикл for, чтобы получить его свойства, и при этом хочу итерировать их частями (не все свойства объекта сразу).

С простым массивом я могу сделать это с помощью стандартного цикла for:

for (i = 0; i < 100; i++) { ... } // первая часть
for (i = 100; i < 300; i++) { ... } // вторая часть
for (i = 300; i < arr.length; i++) { ... } // последняя

Но как сделать то же самое с объектами?

5 ответ(ов)

1

Вот еще одно решение с использованием итерации, подходящее для современных браузеров:

Object.keys(obj)
  .filter((k, i) => i >= 100 && i < 300)
  .forEach(k => console.log(obj[k]));

Или без использования функции filter:

Object.keys(obj).forEach((k, i) => {
    if (i >= 100 && i < 300) {
        console.log(obj[k]);
    }
});

Однако стоит учитывать, что свойства в объекте JavaScript не отсортированы, т.е. не имеют определенного порядка.

0

Единственный надежный способ сделать это — сохранить данные вашего объекта в два массива, один для ключей и один для данных:

var keys = [];
var data = [];
for (var key in obj) {
    if (obj.hasOwnProperty(key)) {
        keys.push(key);
        data.push(obj[key]); // Это не обязательно, но, на мой взгляд, так чище. Смотрите пример ниже.
    }
}

Затем вы можете итерироваться по массивам так, как вы обычно делаете это:

for (var i = 0; i < 100; i++) {
    console.log(keys[i], data[i]);
    // или
    console.log(keys[i], obj[keys[i]]); // сложнее для чтения, по-моему.
}
for (var i = 100; i < 300; i++) {
    console.log(keys[i], data[i]);
}

Я не использую Object.keys(obj), потому что это работает только в IE 9 и выше.

0

Если мы перебираем объект JavaScript и находим ключ массива объектов, то можем воспользоваться методом Object.keys(), который возвращает массив ключей объекта. В приведённом вами коде мы пытаемся перебрать ключи массива Array, что, скорее всего, не совсем то, что вам нужно.

Вот пример кода, который может помочь вам перебрать массив объектов и вывести ключи каждого объекта:

const arrayOfObjects = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' }
];

arrayOfObjects.forEach(obj => {
  Object.keys(obj).forEach(key => {
    console.log('key:', key);
  });
});

В этом примере мы создаём массив объектов и для каждого объекта в этом массиве перебираем его ключи с помощью Object.keys(). В результате для каждого ключа мы выводим его название в консоль.

Если вам нужно что-то другое или у вас есть конкретные требования к вашему коду, пожалуйста, уточните ваш вопрос.

0

Чтобы избежать использования селекторов и подскриптов, можно определить объект напрямую в аргументах функции. Это позволяет упростить синтаксис, избегая обращения к свойствам объекта внутри итератора. В представленном ниже примере k обозначает ключ, v — значение, а i — индекс.

const obj = {
    kiwi: true,
    mango: false,
    pineapple: 500
};

Object.entries(obj).forEach(([k, v], i) => {
    console.log(k, v, i);
});

// kiwi true 0
// mango false 1
// pineapple 500 2

Таким образом, использование деструктуризации в аргументах делает код более читаемым и позволяет напрямую работать с параметрами без дополнительных обращений к объекту.

0

Если у вас есть простой объект, вы можете перебрать его, используя следующий код:

let myObj = {
  abc: '...',
  bca: '...',
  zzz: '...',
  xxx: '...',
  ccc: '...',
  // ...
};

let objKeys = Object.keys(myObj);

// Теперь мы можем использовать objKeys для перебора myObj

for (let item of objKeys) {
  // это выведет ключи
  console.log('ключ:', item);
  
  // это выведет значения 
  console.log('значение:', myObj[item]);
}

Если у вас есть вложенный объект, вы можете перебрать его, используя следующий код:

let b = {
  one: {
    a: 1,
    b: 2,
    c: 3
  },
  two: {
    a: 4,
    b: 5,
    c: 6
  },
  three: {
    a: 7,
    b: 8,
    c: 9
  }
};

let myKeys = Object.keys(b);

for (let item of myKeys) {
  // вывести ключ
  console.log('Ключ', item);
  
  // вывести значение (которое будет другим объектом)
  console.log('Значение', b[item]);
  
  // вывести вложенное значение
  console.log('Вложенное значение', b[item]['a']);
}

Если у вас есть массив объектов, вы можете перебрать его, используя следующий код:

let c = [
  {
    a: 1,
    b: 2
  },
  {
    a: 3,
    b: 4
  }
];

for (let item of c) {
  // вывести целый объект по отдельности 
  console.log('объект', item);

  // вывести значение внутри объекта
  console.log('значение', item['a']);
}

Надеюсь, это поможет вам разобраться с перебором объектов и массивов объектов в JavaScript!

Чтобы ответить на вопрос, пожалуйста, войдите или зарегистрируйтесь