Перспективное мышление - неполное руководство по современному циклу For в JavaScript # 1

Я обнаружил, что многие программисты неправильно используют цикл for. Я думаю, что все видели такой код:

const arr = [1, 2, 3, 4];
for (let i=0; i < arr.length; i++ ) {
    console.log (arr[i]);
}

Что не так с этим? В каждом цикле мы вычисляем длину arr. И эта длина не меняется, поэтому чтение одной и той же информации X раз - пустая трата ресурсов.

Второй подход, который мы видим, - это улучшенная версия предыдущего:

const arr = [1, 2, 3, 4];
const arrLength = arr.length;
/*
* Some superb comment about what is happening
* in this very loop
*/
for (let i=0; i < arrLength; i++ ) {
    console.log (arr[i]);
}

Лучше, но arrLength выходит за рамки цикла.

Итак, давайте попробуем третий вариант, который я предпочитаю:

const arr = [1, 2, 3, 4];
/*
* Some superb comment about what is happening
* in this very loop
*/
for (let i=0, arrLength = arr.length; i < arrLength; i++){
    console.log (arr[i]);
}

Все переменные, которые нам нужны в цикле for, определены в его области видимости. Он намного короче и улучшает управление памятью (ни одна переменная не живет дольше, чем это необходимо).

Это возможно, потому что цикл for имеет следующий синтаксис:

for (initialization; condition; statement ) {
   //code block to be executed in each loop
}

Мы даже можем сделать такой код:

const arr = [1, 2, 3, 4];
for (let i=0, arrLength = arr.length; i < arrLength; console.log (arr[i++]) );

Но не рекомендую. Трудно читать и понимать.

Последний, но тем не менее важный. Я знаю, что есть лучшие / разные решения. Мы вообще можем программировать без цикла!

Ниже приведен небольшой пример:

const myArray = [1, 2, 3, 4];
const map = f => x => Array.prototype.map.call(x, f)
const log = x => console.log(x);
const logElementsInArray = map(log);
logElementsInArray(myArray);