Перебрать массив в JavaScript

Question

В Java вы можете использовать цикл for для обхода объектов в массиве следующим образом:

String[] myStringArray = {"Hello", "World"};
for (String s : myStringArray)
{
    // Do something
}

Можете ли вы сделать то же самое в JavaScript?

Answer 1

Есть несколько способов сделать это в JavaScript. Первые два примера являются примерами JavaScript. Третий использует библиотеку JavaScript, то есть jQuery использует функцию .each().

var myStringArray = ["hello", "World"];
for(var i in myStringArray) {
  alert(myStringArray[i]);
}

var myStringArray = ["hello", "World"];
for (var i=0; i < myStringArray.length; i++) {
  alert(myStringArray[i]);
}

var myStringArray = ["hello", "World"];
$.each(myStringArray, function(index, value){
  alert(value);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Answer 2

Оптимизированный подход заключается в кэшировании длины массива и использовании одного шаблона var, инициализирующего все переменные одним ключевым словом var.

var i, max, myStringArray = ["Hello","World"];
for (i = 0, max = myStringArray.length; i < max; i++) {
    alert(myStringArray[i]);
   //Do something
}

Если порядок итерации не имеет значения, чем вы должны попробовать обратный цикл, он является самым быстрым, поскольку он сокращает накладные расходы при тестировании, и уменьшение выполняется в одном выражении:

var i,myStringArray = ["item1","item2"];
for (i =  myStringArray.length; i--) {
    alert(myStringArray[i]);
}

или лучше и чище, чтобы использовать цикл while:

var myStringArray = ["item1","item2"],i = myStringArray.length;
while(i--) {
   // do something with fruits[i]
}

Answer 3

В JavaScript существует так много решений для зацикливания массива.

Ниже приведены популярные коды

/** Declare inputs */
const items = ['Hello', 'World']

/** Solution 1. Simple for */
console.log('solution 1. simple for')

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

console.log()
console.log()

/** Solution 2. Simple while */
console.log('solution 2. simple while')

let i = 0
while (i < items.length) {
  console.log(items[i++])
}

console.log()
console.log()

/** Solution 3. forEach*/
console.log('solution 3. forEach')

items.forEach(item => {
  console.log(item)
})

console.log()
console.log()

/** Solution 4. for-of*/
console.log('solution 4. for-of')

for (const item of items) {
  console.log(item)
}

console.log()
console.log()

Answer 4

На мой взгляд, лучший способ - использовать функцию Array.forEach. Если вы не можете использовать это, я бы посоветовал получить polyfill из MDN, чтобы сделать его доступным, это, безусловно, самый безопасный способ перебора массива в JavaScript.

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

Итак, как и предполагали другие, это почти всегда то, что вы хотите:

var numbers = [1,11,22,33,44,55,66,77,88,99,111];
var sum = 0;
numbers.forEach(function(n){
  sum += n;
});

Это гарантирует, что все, что вам нужно в области обработки массива, остается в этой области, и что вы обрабатываете только значения массива, а не свойства объекта и другие члены, что и нужно для ... in.

Использование обычного стиля c для цикла работает в большинстве случаев, просто важно помнить, что все внутри цикла разделяет его область действия с остальной частью вашей программы, {} не создает новую область действия.

Таким образом:

var sum = 0;
var numbers = [1,11,22,33,44,55,66,77,88,99,111];

for(var i = 0; i<numbers.length; ++i){ 
  sum += numbers[i];
}

alert(i);

выведет «11» - что может или не может быть тем, что вы хотите.

Рабочий пример jsFiddle: https://jsfiddle.net/workingClassHacker/pxpv2dh5/7/

Answer 5

Краткий ответ: да. Вы можете сделать с этим:

var myArray = ["element1", "element2", "element3", "element4"];

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

В консоли браузера вы можете увидеть что-то вроде «element1», «element2» и т. Д., Напечатанное.

Answer 6

var x = [4, 5, 6];
for (i = 0, j = x[i]; i < x.length; j = x[++i]) {
    console.log(i,j);
}

намного чище ...

Answer 7

Если вы хотите использовать jQuery, в документации есть хороший пример:

 $.each([ 52, 97 ], function( index, value ) {
      alert( index + ": " + value );
 });

Answer 8

Например, я использовал в консоли Firefox:

[].forEach.call(document.getElementsByTagName('pre'), function(e){ 
   console.log(e);
})

Answer 9

Это не на 100% идентично, но похоже:

   var myStringArray = ['Hello', 'World']; // array uses [] not {}
    for (var i in myStringArray) {
        console.log(i + ' -> ' + myStringArray[i]); // i is the index/key, not the item
    }

Answer 10

Простое решение в одну строку

arr = ["table", "chair"];

// solution
arr.map((e) => {
  console.log(e);
  return e;
});