Получение данных по API и перенос в массив объектов

Question

Всем привет! У меня есть fetch запрос который получает массив объектов, вот как он выглядит [{symbol: 'BTCUSDT', bidPrice: '28385.87000000', bidQty: '1.62422000', askPrice: '28385.88000000', askQty: '6.30315000'}] я его извлекаю из массива и добавляю его в свой, но когда я обращаюсь к своему массиву arr[0] то он выдает undefined в чем проблема? Как ее решить?

    
async function getData (url) {
    const result = await fetch(`${url}`);
    if(!result.ok) {
        throw new Error(`Error status:" ${res.status} from ${res.url}`);
    }
    return result.json();
}
const binanceSymbols = ["BTCUSDT", "ETHUSDT", "BNBUSDT"];
let arr = [];
binanceSymbols.forEach((item) => {
    getData(https://api.binance.com/api/v3/ticker/bookTicker?symbols=["${item}"]).then((data) => {
        arr.push(...data);
    })
})
console.log(arr[0]); // undefined

score 0 · Answer 1 · edited Apr 27 '23 at 11:10

Проблема заключается в том, что getData() возвращает данные асинхронно, поэтому в момент обращения к arr[0] запрос еще не завершен и массив пустой. Чтобы решить эту проблему, необходимо дождаться завершения всех Promise-объектов, возвращаемых внутри цикла forEach(). Одним из способов решить проблему может быть использование метода Promise.all(), который позволяет дождаться завершения массива Promise-объектов и затем выполнить некоторое действие. В Вашем случае это будет выглядеть так:

async function getData (url) {
    const result = await fetch(url);
    if(!result.ok) {
        throw new Error(Error status:" ${res.status} from ${res.url()});
    }
    return result.json();
}
const binanceSymbols = ["BTCUSDT", "ETHUSDT", "BNBUSDT"];
let arr = [];
// Создаем массив Promise-объектов для запросов
const promises = binanceSymbols.map((item) => {
    return getData(https://api.binance.com/api/v3/ticker/bookTicker?symbols=[&quot;${item}&quot;]);
});
// Дожидаемся завершения всех Promise-объектов
Promise.all(promises)
    .then((data) => {
        // Объединяем все данные в один массив
        arr = data.flat();
        console.log(arr[0]); // Выводим первый элемент массива
    })
    .catch((err) => {
        console.error(err);
    });

В данном случае мы создаем массив Promise-объектов promises, заполняем его результатами выполнения функции getData() и дожидаемся их завершения с помощью метода Promise.all(). Объединяем все данные в массив arr, после чего обращаемся к первому элементу.

Получение данных по API и перенос в массив объектов

1 Answers1