Domgame– game logic

Describe how the spread operator is used to convert a node list of selected elements into an array. Describe why we needed this conversion and how the array was helpful for our first test in the game’s logic.

This week is when we create eventListeners and you would have to make a variable for icons. Create a event listener and make a function so you call all the i elements.

//function to call each i individually to get correct answer
function playScene() {
    icons = document.querySelectorAll('i');
    let iconsArr = [...icons];
    iconsArr.forEach(function (icon, indx) {
        icon.addEventListener('click', function () {
            check(icon, indx);
        })
    })
}

When icons are called in the console then the NodeList of all icons selector is shown then you would add an event listener and use a for loop like this. But this cannot work because we would not know which one is actually being clicked you can see the number of times an icon is pressed.

// for (let i = 0; i < icons.length; i++) {
    //     icons[i].addEventListener('click', function () {
    //         console.log('clicked');
    //     })
    // }
    //doesn't work cause we don't know which icon is being clicked.

The NodeList would need to be put into an array so a foreach method can be used and show us the index. The spread operator can be used to look at many arguments as there is and pass a value one at a time. Which is shown in the code above. The spread operator is calling each value from the NodeList.

Join the Conversation

1 Comment

Leave a comment

Your email address will not be published. Required fields are marked *

css.php