Build a Music Player - Step 27

Tell us what’s happening:

I tried doing this step 27 using strict equality operator and it didn’t work. Then I used loose equality operator and it worked.
I am just confused about why that happened. Can someone explain? Thanks.

Your code so far

<!-- file: index.html -->

/* file: styles.css */

/* file: script.js */
// User Editable Region
  else {
    if (userData.currentSong !== null && getNextSong() !== null) {
      playSong(getNextSong().id)
    }
    
    if (userData.currentSong.id === allSongs.length - 1) {
      userData.currentSong = null;
      userData.songCurrentTime = 0;
      pauseSong();
    }
  }
// 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/149.0.0.0 Safari/537.36

Challenge Information:

Build a Music Player - Step 27

GitHub Link: freeCodeCamp/curriculum/challenges/english/blocks/workshop-music-player/674f534fa181f64a789ffcf9.md at main · freeCodeCamp/freeCodeCamp · GitHub

Hey @chaotic.stardust ,

const getNextSong = () => userData.songs[getCurrentSongIndex() + 1];

When the currentSong is the last song of playlist, getCurrentSongIndex() + 1 goes out the bound and when you try to access out-of-bounds array index, it will return undefined, not null.

So coming to your comparison userData.currentSong !== null && getNextSong() !== null,

undefined !== null // true, strict equality treat them as different types.
undefined != null // false as loose equality treats them as equal.

Also if an if statement has a return then you don’t need to write an else block. Once you return, the rest of the function won’t execute anyway, so else is just a code chunk which will be never used.

Ahh got it! Thanks :+1: