Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript Object-Oriented JavaScript (2015) Constructor Functions and Prototypes Making the UI Work

Francesco Belvedere
Francesco Belvedere
15,206 Points

Semicolons after each htmlString+= statement?

Shouldnt there be semicolons at the end of each htmlString += statement in the toHTML function in songs.js?

Like this:

Song.prototype.toHTML = function() {
  var htmlString = '<li';
  if (this.isPlaying) {
    htmlString += ' class="current"';
  }
  htmlString += '>';
  htmlString += this.title;
  htmlString += ' - ';
  htmlString += this.artist;
  htmlString += '<span class="duration">';
  htmlString += '</span></li>';

  return htmlString;
};

I feel Andrew forgot some of these but not sure.

My code isnt working. I am getting an error telling me that toHTML is not a function.

Here is the link to my Workspace: https://teamtreehouse.com/workspaces/8377402#

2 Answers

Francesco Belvedere
Francesco Belvedere
15,206 Points

I found my error:

Playlist.prototype.renderInElement = function(list) { list.innerHTML = ""; for (var i = 0; i < this.songs.length; i++) { list.innerHTML += this.songs[i];toHTML(); } };

I had a semi-colon after the [i] index before the toHTML() call.

But my questions still stands in regards to the semi-colons on each htmlString+= statement.

Should there be a semi-colo after each statement?

I have them on each of mine and the code works.

Just curious.

FB //

The truth of the matter is that semicolons in JavaScript are optional in all but a few cases. JavaScript has what is known as Automatic Semicolon Insertion (ASI). I never place unnecessary semicolons in my code as a matter of style and readability. I have yet to run into a single issue from doing this because I took the time to become familiar with the few exceptions to this style of coding.

This article might answer any questions you have about JavaScript's ASI:

http://inimino.org/~inimino/blog/javascript_semicolons

Many people, including well-known JavaScript authorities, still recommend placing semicolons at the end of each and every statement. I personally disagree; I find semicolons contribute to more confusing-looking and less beautiful code. In one article I read, the author even removed all semicolons from the jQuery source code and it still compiled without error.

In the end, pick whichever style you prefer and be consistent. But, if you do choose to abandon semicolon use in your JavaScript code, be sure memorize the several exceptions:

  • Insert a semicolon before any independent line of code that begins with a '(', '[', '/', '+', '-' or '*'.
  • Be careful with whitespace around any keywords such as: return, break, continue, throw, etc...
Francesco Belvedere
Francesco Belvedere
15,206 Points

In the video at the 2:18 mark Andrew leaves the semicolons off at lines 21 and 23 — so I thought that was my issue.

I added tthem to the end of all my htmlString statements and I still am getting the same error — toHTML is not a defined funtion?

Uncaught ReferenceError: toHTML is not definedPlaylist.renderInElement @ playlist.js:32(anonymous function) @ app.js:11