Введение
С тех пор, как я учился в колледже, я программировал на Java, JavaScript, Pascal, ABAP , PHP, Progress 4GL, C / C ++ и, возможно, на нескольких других языках, о которых я сейчас не могу думать. .
Хотя все они имеют свои собственные лингвистические особенности, каждый из этих языков имеет много общих базовых понятий. К таким понятиям относятся процедуры / функции, IF -условия, FOR -циклы и WHILE -циклы.
Традиционный for -петл
Традиционный цикл for состоит из трех компонентов:
- Инициализация: , выполненная до первого выполнения блока просмотра
- Условие: проверяет условие каждый раз перед выполнением блока цикла и выходит из цикла, если ложно
- Запоздалая мысль: выполняется каждый раз после выполнения цикла цикла
Эти три компонента отделены друг от друга символом ;. Содержимое для каждого из этих трех компонентов является необязательным, что означает, что нижеследующий цикл является наиболее минимальным из возможных for:
for (;;) {
// Do stuff
}
Конечно, вам нужно будет включить if(condition === true) { break; } или if(condition === true) { return; } где-нибудь внутри этого for -петля, чтобы он прекратил работать.
Обычно, однако, инициализация используется для объявления индекса, условие используется для сравнения этого индекса с минимальным или максимальным значением, а запоздалая мысль используется для увеличения индекса:
for (var i = 0, length = 10; i < length; i++) {
console.log(i);
}
Использование традиционного цикла for для обхода массива
Традиционный способ перебрать массив:
for (var i = 0, length = myArray.length; i < length; i++) {
console.log(myArray[i]);
}
Или, если вы предпочитаете цикл в обратном направлении, вы делаете это:
for (var i = myArray.length - 1; i > -1; i--) {
console.log(myArray[i]);
}
Однако возможны многие варианты, например, такие:
for (var key = 0, value = myArray[key], length = myArray.length; key < length; value = myArray[++key]) {
console.log(value);
}
... или этот ...
var i = 0, length = myArray.length;
for (; i < length;) {
console.log(myArray[i]);
i++;
}
... или этот:
var key = 0, value;
for (; value = myArray[key++];){
console.log(value);
}
То, что лучше всего работает, в значительной степени зависит как от личного вкуса, так и от конкретного варианта использования, который вы реализуете.
Обратите внимание, что каждый из этих вариантов поддерживается всеми браузерами, включая очень старые!
A while loop
Одной альтернативой циклу for является цикл while. Чтобы перебрать массив, вы можете сделать это:
var key = 0;
while(value = myArray[key++]){
console.log(value);
}
Как и традиционные for петли, while петли поддерживаются даже в самых старых браузерах.
Также обратите внимание, что каждый цикл while можно переписать как цикл for. Например, цикл while, описанный выше, ведет себя точно так же, как этот for -loop:
for(var key = 0; value = myArray[key++];){
console.log(value);
}
For...in и for...of
В JavaScript вы также можете сделать это:
for (i in myArray) {
console.log(myArray[i]);
}
Это следует использовать с осторожностью, однако, поскольку оно не ведет себя так же, как традиционный цикл for во всех случаях, и существуют потенциальные побочные эффекты, которые необходимо учитывать. См. Почему использование «for ... in» с итерацией массива - плохая идея? для получения более подробной информации.
В качестве альтернативы for...in, теперь есть и для for...of. В следующем примере показана разница между циклом for...of и циклом for...in:
var myArray = [3, 5, 7];
myArray.foo = "hello";
for (var i in myArray) {
console.log(i); // logs 0, 1, 2, "foo"
}
for (var i of myArray) {
console.log(i); // logs 3, 5, 7
}
Кроме того, необходимо учитывать, что ни одна версия Internet Explorer не поддерживает for...of ( Edge 12 + поддерживает) и что для for...in требуется как минимум Internet Explorer 10.
Array.prototype.forEach()
Альтернативой for -loops является Array.prototype.forEach(), в котором используется следующий синтаксис:
myArray.forEach(function(value, key, myArray) {
console.log(value);
});
Array.prototype.forEach() поддерживается всеми современными браузерами, а также Internet Explorer 9 и более поздними версиями.
Библиотека
Наконец, многие служебные библиотеки также имеют свои собственные варианты foreach. AFAIK, три самых популярных из них:
jQuery.each(), в JQuery :
$.each(myArray, function(key, value) {
console.log(value);
});
_.each(), в Underscore.js :
_.each(myArray, function(value, key, myArray) {
console.log(value);
});
_.forEach(), в Lodash.js :
_.forEach(myArray, function(value, key) {
console.log(value);
});