For Loops


#1


Have for loop warnings, and I am trying to use only regular for loops or the forEach method (as opposed to for-in loops Trying to remove all warnings been detected in jshint. So as seen in the code, I am kindly asking someone to help me change even one [for-in] loop to a [for ++] loop with explanation as to what is happening, cause I just don;t seem to get it. Your response will be highly appreciated. Thanks!


bio.display = function() {
	if (bio.skills.length > 0) {
    	$("#header").append(HTMLskillsStart);
    	for (var i in bio.skills) {
        $("#skills").append(HTMLskills.replace("%data%", bio.skills[i]));
    	}
    }
};
bio.display();

for (i in formattedContactInfo) {
    $("#topContacts").append(formattedContactInfo[i]);
    $("#footerContacts").append(formattedContactInfo[i]);
}

work.display = function() {
    if (work.jobs.length > 0) {
        $("#workExperience").append(HTMLworkStart);
        for (i in work.jobs) {
            var formattedEmployer = HTMLworkEmployer.replace("%data%", work.jobs[i].employer);
            var formattedWorkTitle = HTMLworkTitle.replace("%data%", work.jobs[i].title);
            var formattedWorkLocation = HTMLworkLocation.replace("%data%", work.jobs[i].location);
            var formattedDatesWorked = HTMLworkDates.replace("%data%", work.jobs[i].dates);
            var formattedWorkDescription = HTMLworkDescription.replace("%data%", work.jobs[i].description);
            var formattedEmployerWorkTitle = formattedEmployer + formattedWorkTitle;
            $(".work-entry:last").append(formattedEmployerWorkTitle);
            $(".work-entry:last").append(formattedWorkLocation);
            $(".work-entry:last").append(formattedDatesWorked);
            $(".work-entry:last").append(formattedWorkDescription);
        }
    }
};
work.display();
projects.display = function() {
    if (projects.projects.length > 0) {
        for (i in projects.projects) {
            $("#projects").append(HTMLprojectStart);
            var formattedProjectTitle = HTMLprojectTitle.replace("%data%", projects.projects[i].title).replace("#", projects.projects[i].url);
            var formattedProjectDates = HTMLprojectDates.replace("%data%", projects.projects[i].dates);
            var formattedProjectDescription = HTMLprojectDescription.replace("%data%", projects.projects[i].description);
            $(".project-entry:last").append(formattedProjectTitle);
            $(".project-entry:last").append(formattedProjectDates);
            $(".project-entry:last").append(formattedProjectDescription);
            for (var img in projects.projects[i].images) {
                var formattedProjectImage = HTMLprojectImage.replace("%data%", projects.projects[i].images[img]);
                $(".project-entry:last").append(formattedProjectImage);
            }
        }
    }
};
projects.display();
education.display = function() {
    if (education.schools.length > 0 || education.onlineCourses.length > 0) {
        for (i in education.schools) {
            $("#education").append(HTMLschoolStart);
            var formattedSchoolName = HTMLschoolName.replace("%data%", education.schools[i].name).replace("#", education.schools[i].url);
            var formattedSchoolDegree = HTMLschoolDegree.replace("%data%", education.schools[i].degree);
            var formattedSchoolDates = HTMLschoolDates.replace("%data%", education.schools[i].dates);
            var formattedSchoolLocation = HTMLschoolLocation.replace("%data%", education.schools[i].location);
            var formattedSchoolMajor = HTMLschoolMajor.replace("%data%", education.schools[i].majors);
            var formattedSchoolMinor = HTMLschoolMinor.replace("%data%", education.schools[i].minor);
            $(".education-entry:last").append(formattedSchoolName + formattedSchoolDegree);
            $(".education-entry:last").append(formattedSchoolDates);
            $(".education-entry:last").append(formattedSchoolLocation);
            $(".education-entry:last").append(formattedSchoolMajor);
            $(".education-entry:last").append(formattedSchoolMinor);
        }
        if (education.onlineCourses.length > 0) {
            $("#education").append(HTMLonlineClasses);
            for (i in education.onlineCourses) {
                $("#education").append(HTMLschoolStart);
                var formattedOnlineTitle = HTMLonlineTitle.replace("%data%", education.onlineCourses[i].title).replace("#", education.onlineCourses[i].url);
                var formattedOnlineSchool = HTMLonlineSchool.replace("%data%", education.onlineCourses[i].school);
                var formattedOnlineDates = HTMLonlineDates.replace("%data%", education.onlineCourses[i].dates);
                var formattedOnlineURL = HTMLonlineURL.replace("%data%", education.onlineCourses[i].url).replace("#", education.onlineCourses[i].url);
                $(".education-entry:last").append(formattedOnlineTitle + formattedOnlineSchool);
                $(".education-entry:last").append(formattedOnlineDates);
                $(".education-entry:last").append(formattedOnlineURL);
            }
        }
    }
};
education.display();


#2

for-in and for aren't equivalent, consider:

myObject = {
  key1: 'value1',
  key2: 'value2',
  key3: 'value3',
}
for (key in myObject) {
  console.log(key);
}

key1
key2
key3

Also, for-in doesn't guarantee any particular order.

If the keys were to happen to be numbered from 0..size-1 as they do in an array, then you can use a for loop, looping up from 0 is as basic as it gets so you should have no issues with that, or if you do you'd have to explain what that is.

If the objects being iterated through have forEach methods, then a start would be to look up some examples on using those: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach


#3

  "display": function() {
    for(var i=0; i < work.jobs.length; i++) {
      $('#workExperience').append(HTMLworkStart);
      $('.work-entry').eq(i).append(HTMLworkEmployer.replace('%data%', work.jobs[i]['employer'])
      .replace('#', work.jobs[i]['url'])
      + HTMLworkTitle.replace('%data%', work.jobs[i]['title']))
      .append(HTMLworkLocation.replace('%data%', work.jobs[i]['location']))
      .append(HTMLworkDates.replace('%data%', work.jobs[i]['dates worked']))
      .append(HTMLworkDescription.replace('%data%', work.jobs[i]['description']));
    };
  }
}; //work

Then how do you explain this for loop doing the same thing as for-in?


#4

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.