1let array = ['Item 1', 'Item 2', 'Item 3'];
2
3array.forEach(item => {
4 console.log(item); // Logs each 'Item #'
5});
1let array = ['Item 1', 'Item 2', 'Item 3'];
2
3// Here's 4 different ways
4for (let index = 0; index < array.length; index++) {
5 console.log(array[index]);
6}
7
8for (let index in array) {
9 console.log(array[index]);
10}
11
12for (let value of array) {
13 console.log(value); // Will each value in array
14}
15
16array.forEach((value, index) => {
17 console.log(index); // Will log each index
18 console.log(value); // Will log each value
19});
1JavaScript supports different kinds of loops:
2
3for - loops through a block of code a number of times
4for/in - loops through the properties of an object
5for/of - loops through the values of an iterable object
6while - loops through a block of code while a specified condition is true
7do/while - also loops through a block of code while a specified condition is true
8
9for (let i = 0; i < cars.length; i++) {
10 text += cars[i] + "<br>";
11}
12
1let array = ['Item 1', 'Item 2', 'Item 3'];
2
3for (let index = 0; index < array.length; index++) {
4 console.log("index", index);
5 console.log("array item", array[index]);
6}
1//There are many loops in javascript that get the job done
2let colors = ["red","blue","green"];
3
4//More detail about loop => shorturl.at/avIRW
5for(let i in colors){
6 console.log(colors[i])
7}
8//More detail about loop => shorturl.at/hBUW2
9colors.forEach(color => {
10 console.log(color)
11})
12//More detail about loop => shorturl.at/pLOV6
13colors.map(color => {
14 console.log(color)
15})
16//More detail about loop => shorturl.at/hlstV
17for(let i = 0; i < colors.length; i++){
18 console.log(colors[i])
19}
20//More detail about loop => shorturl.at/iKS38
21let i = 0;
22while ( i < colors.length ){
23 console.log(colors[i])
24 i++
25}
1var colors=["red","blue","green"];
2for(let color of colors){
3 console.log(color)
4}
1let array = ["foo", "bar"]
2
3let low = 0; // the index to start at
4let high = array.length; // can also be a number
5
6/* high can be a direct access too
7 the first part will be executed when the loop starts
8 for the first time
9 the second part ("i < high") is the condition
10 for it to loop over again.
11 the third part will be executen every time the code
12 block in the loop is closed.
13*/
14for(let i = low; i < high; i++) {
15 // the variable i is the index, which is
16 // the amount of times the loop has looped already
17 console.log(i);
18 console.log(array[i]);
19} // i will be incremented when this is hit.
20
21// output:
22/*
23 0
24 foo
25 1
26 bar
27*/
1<!DOCTYPE html>
2<html>
3 <head>
4 <meta charset="utf-8">
5 <title>Basic for loop example improved</title>
6 <style>
7
8 </style>
9 </head>
10 <body>
11
12 <p></p>
13
14
15 <script>
16 const cats = ['Bill', 'Jeff', 'Pete', 'Biggles', 'Jasmin'];
17 let info = 'My cats are called ';
18 const para = document.querySelector('p');
19
20 for(let i = 0; i < cats.length; i++) {
21 if(i === cats.length - 1) {
22 info += 'and ' + cats[i] + '.';
23 } else {
24 info += cats[i] + ', ';
25 }
26 }
27
28 para.textContent = info;
29
30 </script>
31
32 </body>
33</html>
34