Блог

Главная - Вопросы по программированию - Получение всех строковых значений из вложенного объекта

Получение всех строковых значений из вложенного объекта

#javascript #arrays #object

#javascript #массивы #объект

Вопрос:

У меня есть объект с вложенными объектами. Как мне настроить таргетинг на определенный индекс объекта и перебирать все вложенные значения image . Как вы заметите, длина вложенных объектов различается.

Целевой пример: productArray[0].image = test1.png, test2.png, test3.png

 var products =  [
    //item1
    {
        identifier: "item-0",
        image: {
            "img1": "test1.png",
            "img2": "test2.png",
            "img3": "test3.png"
        }
    },
    //item2
    {
        identifier: "item-1", 
        image: {
            "img1": "test1.png",
            "img2": "test2.png"
        }
    },
    //item3
    {
        identifier: "item-2", 
        image: {
            "img1": "test1.png",
            "img2": "test2.png",
            "img3": "test3.png",
            "img4": "test4.png",
            "img5": "test5.png",
            "img6": "test6.png",
            "img7": "test7.png"
        }
    }
];

Комментарии:

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

Ответ №1:

Мы можем сделать это. Что вам нужно сделать, это простой цикл по объекту с определенным индексом, или вы можете настроить таргетинг на них все. Обратите внимание, что image объект не является массивом, поэтому он не будет иметь точного length свойства.

Нацеливание на все индексы:

 for(var i = 0; i < products.length; i  ) {
  console.log("Item: "   i);
  var images = products[i].image;
  for(var a in images)
   console.log(images[a]);
}

Конкретная цель:

 for(var i in products[0].image)
    console.log(products[0].image[i]);

Здесь я использовал цикл for , но вы можете использовать цикл while, если хотите.

пример

Ответ №2:

Шаги:

  1. Вам нужно выполнить итерацию по вашему исходному массиву продуктов. продукты
  2. Каждый элемент (продукт) будет иметь формат {идентификатор: «», изображение: {«img1»: «img2», ..}} продукты [i]
  3. Вы получаете свойство изображения текущего продукта — это объект. продукты [i].изображение
  4. Теперь вам нужно выполнить итерацию по свойствам объекта изображения. продукты [i].изображение [j]

Код:

 for(var i = 0; i < products.length; i  )
{
  for(var j in products[i].image)
  {
    // Here you have all the images for the current product.
    // You can print them, group them or whatever you want to do with them
    console.log(products[i].image[j]); 
  }
}

Также вы можете изменить код (ввести переменные), чтобы он был более читабельным.

Ответ №3:

 var strs = (function( obj ) {
    var ret = [];
    for( im in obj ) {
         ret.push( obj[im] );
         //You could access each image URL here
         //ad strs in the end will have all of them 
         //comma-separated after this code completes
         // im is the key, obj[ im ] the value
    }
    return ret.join(',');
})( products[0].image );

console.log( strs );

РАБОЧАЯ ДЕМОНСТРАЦИЯ JS FIDDLE

Ответ №4:

Вот еще один способ сделать это, с более новыми функциями в ECMAScript 5

 var images = Object.keys(products[2].image).map(function(key){
    return products[2].image[key]
})

console.log(images) // Returns: ["test1.png", "test2.png", "test3.png", "test4.png", "test5.png", "test6.png", "test7.png"]

Как это работает:

Object#keys возвращает массив имен ключей. Array#map создает новый массив, используя ключи from Object#keys . Просматривая ключ из объекта, вы получаете значение, которое будет именем изображения.

СКРИПКА JS

Метки: