Home

Random words with Async/Await



const number = document.getElementById('number');
const dl = document.querySelector('dl');
const wordUrl = 'https://random-words-api.vercel.app/word';

async function fetchWord() {
    const response = await fetch(wordUrl);
    return response.json();
}

async function updatePage(words) {
    const responses = await Promise.all(words);
    responses.forEach((response, index) => {
        console.log(`response ${index}`, response);
        dl.innerHTML += `<dt>${response[0].word}</dt><dd>${response[0].definition}</dd>`;
    });
}

number.addEventListener('change', () => {
    console.clear();
    dl.innerHTML = '';
    const words = [];
    for (let i = 1; i <= number.value; i++) {
        words.push(fetchWord());
    }
    updatePage(words);
});

number.dispatchEvent(new Event('change'));