Understanding call and "this"

Someone passed me a better version of my drum machine. I understand most of it, but I do have some doubts:

Not really sure how index and target are working here.
It would be awesome if someone could explain these things to me!

This (document.querySelectorAll(’.drum-pad’)) returns a NodeList of classes of .drum-pad, therefore it’s not an array and can’t use regular array methods like indexOf. That’s why the first line is converting nodelist into an actual array so that later code can perform .indexOf.

I will refer you to this link to explain [].slice.call

Thank you both for the replies. Now I need to figure out how index works in the handler.

I´m having troubles figuring out how “this” (which I assume refers to index) and target work in this context. I have a raw idea (basically, index determines a position in the dps array based on the user input) but I´m not sure.

this line here I mean

Thank you. So it´s using IndexOf to look inside dps and see if the clicked button matches?

Thank you so much! Now it makes sense.