Learn Basic String and Array Methods by Building a Music Player - Step 19

JavaScript
1

Tell us what’s happening:

I have reset this lesson and retried it but nothing seems to be working. I am not sure what I am doing wrong here. Please can I get some help?

// User Editable Region

 const songsHTML = array.map(song => `
      <div class="song" data-id="${song.id}">
        <h2>${song.title}</h2>
        <p>${song.artist}</p>
        <p>${song.duration}</p>
      </div>
    `).join("");
  playlistSongs.innerHTML = songsHTML;
};



renderSongs(userData.songs);

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/126.0.0.0 Safari/537.36

Challenge Information:

Learn Basic String and Array Methods by Building a Music Player - Step 19

2

Please reset the code.

Then, please follow the instructions exactly. The instructions were:

Pass in a callback function to the map() method. The callback function should take song as a parameter, use the arrow function syntax, and have an empty body.

If you need help understanding this instruction, let us know.

3

i do need help in understanding it

4

Okay, let’s break it up into small pieces and check which one is the unclear one.

1-Pass in a callback function to the map() method.
2- The callback function should take song as a parameter,
3- use the arrow function syntax,
4- and have an empty body.

There are about 4 different concepts here. Can you tell me which one you know how to do and which one is confusing?

If you know one of them, show me the code you would write.

5

i know step number 3 and 1
hello = () => “Hello World!”; an example would be this for the arrow syntax
const newArr = numbers.map(myFunction) would be syntax for the map () method
i am confused about the other two

6

Good! Please combine the two examples into one but this time, give map a completely empty arrow function.
A completely empty arrow function is like this: () => {}

This is an arrow function that has no parameters and an empty body btw.

7

hello = () => {}const newArr = numbers.map()
is this what you mean

8

Try writing the arrow function inside the map parentheses as the map function is expecting a callback

9

hello = () {}const newArr = numbers.map(=>)
is this correct?

10

Not yet.

Remember that the arrow function is this:
()=>{}

So try adding that to the map in your code. Between the two parentheses

11

It works now thanks tho for your help

1 Like