Loops offer a quick and easy way to do something repeatedly. You can think of a loop as a computerized version of the game where you tell someone to take X steps in one direction, then Y steps in another. JavaScript loops are essential for efficiently handling repetitive tasks. They execute a block of code repeatedly as long as a specified condition remains true. These loops are powerful tools for automating tasks and streamlining your code.

Here are the different type of loops:

• for: loop repeats until a specified condition evaluates to false.
  • for (let i = 0; i <= 10; i++) {
    • console.log(i);
  • }
• as long as (i) evaluates to true, the loop continues to run
• once (i) becomes greater than 10, it is evaluated as false and the loop ends

• while: statement executes its statements as long as a specified condition evaluates to true.
  • let n = 0;
  • let x = 0;
  • while (n < 3) {
    • n++;
    • x += n;
  • }

• do ... while: statement repeats until a specified condition evaluates to false.
  • let i = 0;
  • do {
    • i += 1;
    • console.log(i);
  • } while (i < 5);

• for ... of: statement creates a loop Iterating over iterable objects (including Array, Map, Set, arguments object and so on), invoking a custom iteration hook with statements to be executed for the value of each distinct property.
• Since arrays are Iterable Objects, we can use the for ... of loop to isolate and use the object data.
• *note: For/of is not supported in Internet Explorer
  
  
  • let numbers = [1, 2, 3, 4, 5];
  • 
    
  • for (let num of numbers) {
    • console.log(num);
  • }
• so the loop assigns a variable (num) to the property at the array index, each time through the loop, which you can then manipulate. In this case, just display the [num] variable.

• For objects that are NOT iterable, we can use the for ... in loop to isolate and use the object data.
• for ... in: statement iterates a specified variable over all the enumerable properties of an object. For each distinct property, JavaScript executes the specified statements.
  • const scores = {
    • keenan: 80,
    • damon: 67,
    • kim: 89,
    • shawn: 91,
    • marlon: 72,
    • dwayne: 77,
    • nadia: 83,
    • elvira: 97,
    • diedra: 81,
    • vonnie: 60
  • }
  • 
    
  • for (let person in scores) {
    • console.log(`${person} scored a ${scores[person]}`);
  • }
• so again, the loop assigns a variable (person) to each object property as it loops through, which you can then manipulate. In this case, just display "[person] scored a score[person]"
  
  

The Object method

• Another option to the for ... in loop is to use the Object method.
  
  
• Using the Object method converts the non-iterable object into an ARRAY, which is iterable. Once you have the array you can use the for ... of loop listed above to then manipulte the object data.
  
  
• if we use Object.keys(scores), we get:
  • 'keenan', 'damon', 'kim', 'shawn', 'marlon', 'dwayne', 'nadia', 'elvira', 'diedra', 'vonnie'
• if we use Object.values(scores), we get:
  • 80, 67, 89, 91, 72, 77, 83, 97, 81, 60
• and, if we use Object.entries(scores), we get:
  • ['keenan', 80], ['damon', 67], ['kim', 89], ['shawn', 91], ['marlon', 72], ['dwayne', 77], ['nadia', 83], ['elvira', 97], ['diedra', 81], ['vonnie', 60]
    
    
• so for the previous example:
  • const scores = {
    • keenan: 80,
    • damon: 67,
    • kim: 89,
    • shawn: 91,
    • marlon: 72,
    • dwayne: 77,
    • nadia: 83,
    • elvira: 97,
    • diedra: 81,
    • vonnie: 60
  • }
• we could use:
  • for (let person of Object.keys(scores)) {
    • console.log(`${person} scored a ${scores[person]}`);
  • }
• and we are now able to iterate through a non-iterable object.