JavaScript AJAX Basics (retiring) jQuery and AJAX The Office Status Project Revisited

Need help on two topics.

$(document).ready(function() {
$.getJSON('../data/employees.json', function(response){
    var statusHtml = '<ul class="bulleted">';
    $.each(response,function(index ,employee){
      if (employee.inoffice === true){
      statusHtml += '<li class="in">';
      }//true end
      else{
      statusHtml+= '<li class="out">';  
      }//else end
    statusHtml+= employee.name + '</li>';
    });//each end
  statusHtml+= '</ul>';
  $("#employeeList").html(statusHtml);
});//getJson end.
});//ready end.

This is my jquery ajax calls. and it is working fine I have two questions: 1: i really struggled in the past with closing brackets left and scope errors. so commenting out like this really improved my code writing speed. instead of tracing out which scope is ending where. so is this a overkill/bad habbit? commenting out this much.

2: from what i understand about the

$.each(data to be looped. function (index,value));

each method is that it takes whatever data to be lopped and runs a function which has two parameters. Now my question is that we don't do value[i].name but simply value.name. so looking at that i have concluded that the each loop keeps running until there is no index value to go thru. is this correct or i have missed something. thank you.

p.s Where can i see the cheatsheet for commenting again ;-; im only using the three backticks even for js.

1 Answer

Heidi Puk Hermann
Heidi Puk Hermann
33,338 Points

Starting from the bottom up; you ca find a link to the cheatsheet just below the textbook, where you write your questions. It says: "Reference this Markdown Cheatsheet for syntax examples for formatting your post".

Then there is the $.each(). In standard javascript it is written out .forEach(), which maybe makes more semantic sense. It means that you loop through every instance in fx an array, from start to bottom, without having to specify an index number like you have in a regular for-loop or while-loop. The $.each() passes the current value directly to your callback function, which is why there is no need for an index to identify it.

And to your first question... I think it is a very subjective evaluation, when it is too much commenting. Since it helps you improve your speed and decrease the number of errors you are prone to make (especially as beginner), it sounds like it is a good tool for you. I would say that you may have overdone it a bit in my own personal view. Commenting should be used to make the code easier and faster to read and understand, so when you have larger 'elements', fx like your .ready(function() {...}) it makes good sense to mark where it closes, so you know if you are writing inside or outside of it. On the other hand, I find it a bit too much, with the comment at the end of the if-stament. For me it actually broke my reading speed. In that case I would recommend writing it in this form:

if('condition is true') {
   // whatever should happen if true
} else {
   // whatever should happen if false
}

In that case it is clear for the reader that the else-clause is connected to the if-clause. If you then have to have nested conditionals, loops etc. inside the if-statement, making it complicated to read fast, I would mark the ending.

Thank you for the detailed answer