Flow control

JavaScript

var marios = {}; // Empty object
marios.rank = 'First Officer';

// Flight routine
var completeFlight = function() {
    // Complete a flight
    console.log('Completed a flight');
}

console.log('Started as: ' + marios.rank);

// for loop
for (var flights = 0; flights < 100; flights++) {
    completeFlight();
    if (flights === 99) {
        marios.rank = 'Captain';
    }
}

console.log('Promoted to: ' + marios.rank);

Console output

Started as: First Officer
100 Completed a flight
Promoted to: Captain

JavaScript

var marios = {}; // Empty object
marios.rank = 'First Officer';

// Flight routine
var completeFlight = function() {
    // Complete a flight
    console.log('Completed a flight');
}

console.log('Started as: ' + marios.rank);

// while loop
var flights = 0;
while (marios.rank === 'First Officer') {
    completeFlight();
    flights++;
    if (flights === 100) {
        marios.rank = 'Captain';
    }
}

console.log('Promoted to: ' + marios.rank);

//-----------------------------------------

marios.rank = 'First Officer';

console.log('Dropped to: ' + marios.rank);

// do-while loop
flights = 0;
do {
  completeFlight();
  flights++;
  if (flights === 100) {
    marios.rank = 'Captain';
  }
} while (marios.rank === 'First Officer')

console.log('Promoted to: ' + marios.rank);

Console output

Started as: First Officer
100 Completed a flight
Promoted to: Captain
Dropped to: First Officer
100 Completed a flight
Promoted to: Captain

Introduction

These loops iterate over the enumerable properties of an object, in original insertion order. They should not be used to iterate over an Array. It's better to use a traditional for loop with a numeric index or a for...of loop when iterating over arrays.

Example

Iterate over the enumerable properties of an object:

var person = {}; // Empty object

// Dot notation
person.name = 'Marios';
person.surname = 'Sofokleous';
person.age = 27;

// for-in loop
for (var key in person) {
    // Test if key is part of the object
    if (person.hasOwnProperty(key)) {
        console.log(key);
    }
}

These loops iterate over data that iterable object defines to be iterated over. Iterable objects include Arrays, Maps, Sets, Strings, TypedArray, and arguments object.

// ARRAYS
var array = ['marios', 'savvas', 'ioanna', 'kostas'];
for (let person of array) {
    console.log(person);
}
// 'marios'
// 'savvas'
// 'ioanna'
// 'kostas'

// STRINGS
var str = 'Marios';
for (let character of str) {
    console.log(character);
}
// 'M'
// 'a'
// 'r'
// 'i'
// 'o'
// 's'

// MAPS
var map = new Map([['key1', 1], ['key2', 2], ['key3', 3]]);

for (let entry of map) {
    console.log(entry);
}
// ['key1', 1]
// ['key2', 2]
// ['key3', 3]

for (let [key, value] of map) {
  console.log(value);
}
// 1
// 2
// 3

for (let [key, value] of map) {
  console.log(key);
}
// 'key1'
// 'key2'
// 'key3'

Introduction

The for...of statements iterate over data that iterable object defines to be iterated over. Built-in iterable objects include Arrays, Maps, Sets, Strings, TypedArray, and arguments objects.

The for...in statements iterate over the enumerable properties of an object, in original insertion order. They should not be used to iterate over an Array. It's better to use a traditional for loop with a numeric index or a for...of loop when iterating over arrays.

Example

iterableObj, it's an iterable object (Array). It has Array() as its ctor function and Array.prototype as its ctor function's prototype. Therefore, iterableObj inherits myProperty because of inheritance and the prototype chain.

// Ctor is: Array()
// Prototype is: Array.prototype
let iterableObj = [3, 5, 7];
iterableObj.foo = 'hello';

for (let i in iterableObj) {
  console.log(i);
}
// '0'
// '1'
// '2'
// 'foo'

// Add a property/method to the ctor funtion's prototype:
Array.prototype.myProperty = 'hello';

for (let i in iterableObj) {
  console.log(i);
}
// '0'
// '1'
// '2'
// 'foo'
// 'myProperty'

// Wrap the content of the for...in loop in a conditional statement to prevent
// it from iterating over the prototype.
for (let i in iterableObj) {
  if (iterableObj.hasOwnProperty(i)) {
    console.log(i);
  }
}
// '0'
// '1'
// '2'
// 'foo'

// This loop iterates and logs values that 'iterableObj' as an iterable object
// defines to be iterated over, which are 3, 5, 7 and not any of object's
// properties.
for (let i of iterableObj) {
  console.log(i);
}
// 3
// 5
// 7

Introduction

The forEach() method executes a provided function once for each array element.

Example

// Array
const numArray = [1,2,3,4,5,6,7,8,9];

// Callback
function logIfEven(n) {
    if(n % 2 === 0) {
        console.log(n);
    }
}

// Method #1: forEach() invokes logIfEven() for each element in the array
numArray.forEach(function logIfEven(n) {
    if(n % 2 === 0) {
        console.log(n);
    }
});

//2
//4
//6
//8

// Method #2: forEach() invokes logIfEven() for each element in the array
numArray.forEach(logIfEven);

//2
//4
//6
//8

for statement

// Array
const numArray = [1,2,3,4,5,6,7,8,9];

for (let i = 0; i < numArray.length; i++) {
    console.log(numArray[i]);
}

forEach() method

// Array
const numArray = [1,2,3,4,5,6,7,8,9];

numArray.forEach(function(n) {
    console.log(n);
});

for...of statement

// Array
const numArray = [1,2,3,4,5,6,7,8,9];

for (let n of numArray) {
    console.log(n);
}