Each object in the array and the index(optional) which is the position of that object in the array and starts from zero. The createBoard function removes the popup, loops over the image array with forEach, this receives two arguments. This eventListener will house some functions that will start the game The eventListener works immediately the DOM loads (hence the name). This will be done with an eventListener called DOMContentLoaded, which will be added to the document itself. While cardsWon and clicks will record the wins and no of clicks respectively Setting up the board on DOM load in JS Imgs is a variable that we will initialize from here and will hold the images created, cardsId and cardsSelected are arrays that will contain the cards clicked on.
The grid, scoreboard, popup, playAgain and clickBoard are elements from the HTML that we are getting into the JS and will inject data into them. You will notice each object is actually double, and that is because you will be trying to compare two images on the board. The names will be used when we want to compare two images that were clicked.
So we have a cardArray, which is just a list of objects containing images and their names. Enter fullscreen mode Exit fullscreen mode
