Как вывести объект из вложенного массива?

Question

Нужна ваша помощь. У меня есть 5 объектов, выведенных из массива. В каждом из этих объектов имеется поле conversation, которое включает в себя также массив объектов. С помощью данного кода я пытаюсь вывести на страницу поле text, которое находится в каждом из объектов поля conversation, однако не получается это сделать.

Я получаю ошибку, типа element is not iterable, obj is not iterable. Что я делаю не так? Спасибо вам большое

fetch("./messages.json")
.then(response => {return response.json()})
.then(data => {
    for (let i = 42; i < 47; i++) {
        let element = data[i];
        console.log(element)
        for (const obj of element) {

        }
    }
})

fetch("./messages.json")
.then(response => response.json())
.then(data => {
    for (let i = 42; i < 47; i++) {
        for (let obj in Object.values(data[i].conversation)) {
            for (let key of obj) {
                for (let conv in key) {
                    console.log(conv.text);
                }
            }

        }
    }
})

Небольшой пример: есть главный массив, в котором есть поле conversation, в котором содержатся объекты, в которых есть поле text. Именно это поле я пытаюсь вывести на html страницу

let mainArray = [ {participants: ['one', 'two'], conservation: [
        {sender: 'person1', text: "simple_text1"},
        {sender: 'person2', text: "simple_text2"},
        {sender: 'person3', text: "simple_text3"}]}
]

Answer 1

Это обычный цикл по массиву:

let mainArray = [{ participants: ['one1', 'two1'],conservation: [{ sender: 'person1', text: "simple_text1" },{ sender: 'person2', text: "simple_text21" },{ sender: 'person3', text: "simple_text31" }]},
                  {participants: ['one2', 'two2'],conservation: [{ sender: 'person1', text: "simple_text1" },{ sender: 'person22', text: "simple_text2" },{ sender: 'person3', text: "simple_text23" }]},
                  { participants: ['one3', 'two3'],conservation: [{ sender: 'person1', text: "simple_text1" },{ sender: 'person2', text: "simple_text23" },{ sender: 'person3', text: "simple_text33" }]},
                  { participants: ['one4', 'two4'],conservation: [{ sender: 'person1', text: "simple_text1" },{ sender: 'person2', text: "simple_text24" },{ sender: 'person3', text: "simple_text34" }]}
];

for (let i = 1; i <= 2; ++i) {
  for (let conservation of mainArray[i].conservation) {
    //console.log(conservation, '.........text: ', conservation.text);
    document.write(conservation.text + ' ');
    } 
    
  document.write('</br></br> ');
}

В данном случае mainArray[0] потому что на входе объект в массиве..... если бы не было первых квадратных скобок, от было бы просто mainArray.conservation

Answer 2

mainArray – массив, который я уже разобрал на картинке, из 5 объектов. mainArray у меня находится в отдельном файле messages.json, поэтому я использую функцию fetch. В общем, у меня объектов есть 87, однако мне нужно только определенные, поэтому с помощью цикла я выбрал, какие мне нужно (между 42 и 47). У каждого объекта на картинке и на примере моем есть поле conversation, которое внутри себя имеет 100 вложенных объектов. Каждый из этих 100 объектов имеет поле text, так же как и на моем примере. Моя цель состоит в том, чтобы вывести поле text на страницу мою. Здесь проблема во вложенности. Я просто пытался объяснить картинку своим примером, где находится поле text, которое нужно вывести.

Поэтому, по примеру из массива в коде, а также моем условии задания, код решения выглядит так

fetch("./messages.json")
.then(response => {return response.json()})
.then(data => {
    for (let i = 42; i < 47; i++) {
        for (let conversation of data[i].conversation) {
            document.write(`<div>${conversation.text}</div>`)
        }
    }
})

БЛОГ НА HUSL

Как вывести объект из вложенного массива?

Ответы (2 шт):