I do now understand two things here, when I interpolate song.id and song.title, from where is that song coming. Maybe first time I saw the map method, but please explain me what’s happening here.
Your code so far
<!-- file: index.html -->
/* file: styles.css */
/* file: script.js */
// User Editable Region
<button class="playlist-song-info">
<span class="playlist-song-title">${song.title}</span>
</button>
// User Editable Region
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36
Challenge Information:
Learn Basic String and Array Methods by Building a Music Player - Step 22
If you look at the body of the renderSongs function, the songsHTML variable holds the elements of the array, song is used as the variable for the .map() method.
In lesson 19 of this project, where it was taught about map method, it was said it takes a function as an argument. But song is not defined anywhere else. I am unable to understand how data is working here. Please help me.