order matters in javascript function?

I'm on the object orient programming course with javascript. I still consider myself a beginner.

I'm learning things about order. Here is my snap shot, but my question is really specific. https://w.trhou.se/g7a81vktok

In my playlist.js file, between lines 24 to 34 I previously had this:

Playlist.prototype.next = function() {
  this.stop();
  this.nowPlayingIndex++;
 this.play();
  if(this.nowPlayingIndex == this.songs.length) {
    this.nowPlayingIndex = 0; // why are we turning this to zero, shouldn't we tell it to just stop? 
  }

};

I would get these errors in the console, something like this: 'play undefined' and the player wouldn't alternate between the songs and movies all the way (it would only hight the second and third entry ).

but re-watched the video and changed it to this

Playlist.prototype.next = function() {
  this.stop();
  this.nowPlayingIndex++;

  if(this.nowPlayingIndex == this.songs.length) {
    this.nowPlayingIndex = 0; // why are we turning this to zero, shouldn't we tell it to just stop? 
  }

 this.play(); //moved this below the about conditional

};

Now the error vanished and the player works fine, even if I put the code back. Any reason why?