6

Как перебрать структуру JSON?

15

У меня есть следующая структура JSON:

[{"id":"10", "class": "child-of-9"}, {"id": "11", "classd": "child-of-10"}]

Как мне перебрать её с помощью JavaScript?

При переборе я столкнулся с проблемой, так как некоторые объекты имеют разные ключи. В частности, у первого объекта есть ключ class, а у второго — classd. Мне нужно извлечь значения для ключа id и class (или classd, если его нет). Как правильно реализовать это в коде?

5 ответ(ов)

5

Ваш код выглядит хорошо, но есть несколько вещей, которые стоит учесть, особенно если вы работаете с объектами в JavaScript.

Вот как он работает:

  1. Вы создаете массив объектов arr, где каждый объект содержит идентификатор id и класс class.
  2. Основной цикл for проходит по каждому элементу массива arr.
  3. Для каждого объекта из массива вы используете цикл for-in, чтобы перебрать все ключи объекта и вывести их значение на страницу.

Вот сам код для ясности:

var arr = [ {"id":"10", "class": "child-of-9"}, {"id":"11", "class": "child-of-10"}];

for (var i = 0; i < arr.length; i++) {
  document.write("<br><br>array index: " + i);
  var obj = arr[i];
  for (var key in obj) {
    var value = obj[key];
    document.write("<br> - " + key + ": " + value);
  }
}

Обратите внимание, что for-in действительно хорошо подходит для простых объектов. Однако, как вы упомянули, для DOM-объектов это не самый лучший подход, поскольку он также может перебрать и унаследованные свойства, что может привести к неожиданным результатам. Для надежного перебора свойств объекта, лучше использовать метод Object.keys(obj) в сочетании с forEach или обычный цикл for.

Пример использования Object.keys:

var arr = [ {"id":"10", "class": "child-of-9"}, {"id":"11", "class": "child-of-10"}];

for (var i = 0; i < arr.length; i++) {
  document.write("<br><br>array index: " + i);
  var obj = arr[i];
  Object.keys(obj).forEach(function(key) {
    var value = obj[key];
    document.write("<br> - " + key + ": " + value);
  });
}

Таким образом, вы избежите проблем, связанных с унаследованными свойствами, и ваш код станет более предсказуемым.

1

Вы можете использовать цикл for...of, чтобы перебрать массив объектов и вывести на экран имя каждого автомобиля. Вот пример кода:

var mycars = [{name: 'Susita'}, {name: 'BMW'}];

for (var car of mycars) {
  document.write(car.name + "<br />");
}

В результате выполнения этого кода на веб-странице будет отображено:

Susita
BMW

Цикл for...of позволяет удобно итерировать по элементам массива, что делает код более читаемым и простым для понимания.

1

Ваш код выглядит правильно, однако есть несколько мелочей, на которые стоит обратить внимание. Основная логика работы уже написана верно, но для лучшего понимания и избежания потенциальных ошибок, можно предоставить некоторые рекомендации.

  1. Используйте let или const вместо var, чтобы избежать проблем с областью видимости переменных:
const jsonObject = {
  name: 'Amit Kumar',
  age: '27' // рекомендую использовать строчные буквы для ключей в JSON
};
  1. В этом коде вам нужно быть аккуратным с регистровыми именами переменных. В случае написания ключей в объекте, принято использовать строчные буквы, особенно для базовых данных.

  2. Для итерации по объектам лучше использовать метод Object.keys(), который возвращает массив ключей объекта. Это может улучшить читаемость вашего кода:

for (const prop of Object.keys(jsonObject)) {
  alert("Ключ: " + prop);
  alert("Значение: " + jsonObject[prop]);
}

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

const jsonObject = {
  name: 'Amit Kumar',
  age: '27' 
};

for (const prop of Object.keys(jsonObject)) {
  alert("Ключ: " + prop);
  alert("Значение: " + jsonObject[prop]);
}

Это даст вам более современный и безопасный подход к работе с объектами в JavaScript. Если у вас есть дополнительные вопросы или нужно разъяснение, не стесняйтесь задавать!

0

Если у вас есть массив данных dataArray, как в примере:

var dataArray = [{"id":28,"class":"Sweden"}, {"id":56,"class":"USA"}, {"id":89,"class":"England"}];

то следующий код использует jQuery для обхода элементов массива:

$(jQuery.parseJSON(JSON.stringify(dataArray))).each(function() {  
         var ID = this.id;
         var CLASS = this.class;
});

Однако в данном примере нет необходимости использовать jQuery.parseJSON и JSON.stringify, так как dataArray уже является корректным массивом объектов JavaScript. Можно обойти массив проще, как показано ниже:

dataArray.forEach(function(item) {
    var ID = item.id;
    var CLASS = item.class;
    // здесь можно использовать переменные ID и CLASS
});

Или с использованием forEach:

dataArray.forEach(({ id, class: CLASS }) => {
    // Вы можете использовать переменные id и CLASS здесь
});

Таким образом, ваш код становится более привычным для JavaScript и читабельным.

0

Код, который вы привели, создает объект person и затем использует цикл for...in для перебора всех его свойств, объединяя значения этих свойств в одну строку. Для наглядности, вот что происходит по шагам:

  1. Создается объект person с полями fname, lname и age.
  2. Объявляется переменная text, в которую будет записываться результат.
  3. С помощью цикла for...in происходит перебор всех свойств объекта person, где x - это имя текущего свойства.
  4. Значение каждого свойства добавляется к строке text.

В конечном итоге, переменная text будет содержать строку John Doe 25.

Вот полный код:

var person = {fname: "John", lname: "Doe", age: 25};

var text = "";
for (var x in person) {
    text += person[x] + " "; // добавляем пробел между значениями
}

console.log(text.trim()); // выводим строку без лишнего пробела в конце

Результат будет: John Doe 25. Обратите внимание, что в коде выше добавлен пробел между значениями, и используется trim() для удаления лишнего пробела в конце.

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