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

Question

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

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

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

Answer 1

Есть способ сделать это, когда у вас очень мало неявных областей в цикле и вы покончили с дополнительными переменными.

var i = 0,
     item;

// note this is weak to sparse arrays or falsey values
for ( ; item = myStringArray[i++] ; ){ 
    item; // This is the string at the index.
}

Или, если вы действительно хотите получить идентификатор и получить действительно классический цикл for:

var i = 0,
    len = myStringArray.length; // cache the length

for ( ; i < len ; i++ ){
    myStringArray[i]; // Don't use this if you plan on changing the length of the array
}

Все современные браузеры поддерживают методы итераторов forEach, map, reduce, filter и множество других методов в прототипе Array .

Answer 2

Существуют различные способы просмотра массива в JavaScript.

Общий цикл:

var i;
for (i = 0; i < substr.length; ++i) {
    // Do something with `substr[i]`
}

ES5 для каждого:

substr.forEach(function(item) {
    // Do something with `item`
});

jQuery.each:

jQuery.each(substr, function(index, item) {
    // Do something with `item` (or `this` is also `item` if you like)
});

Посмотрите это для получения подробной информации, или вы также можете проверить MDN для просмотра массива в JavaScript и использования проверки jQuery jQuery для каждого .

Answer 3

Я бы настоятельно рекомендовал использовать библиотеку underscore.js .Он предоставляет вам различные функции, которые вы можете использовать для перебора массивов / коллекций.

Например:

_.each([1, 2, 3], function(num){ alert(num); });
=> alerts each number in turn...

Answer 4

Петля массива:

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

Объектный цикл:

for(var prop in obj){
    var propValue = obj[prop];
    console.log(propValue);
}

Answer 5

Да, вы можете сделать то же самое в JavaScript, используя цикл, но не ограничиваясь этим, многие способы сделать циклы над массивами в JavaScrip, представьте, что у вас есть этот массив ниже, и вы хотите сделать цикл над ним:

var arr = [1, 2, 3, 4, 5];

Это решения:

1) Для петли

Цикл For - это распространенный способ циклического перемещения массивов в JavaScript, но он не считается самым быстрым решением для больших массивов:

for (var i=0, l=arr.length; i<l; i++) { 
  console.log(arr[i]);
}

2) Пока цикл

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

let i=0;

while (arr.length>i) {
    console.log(arr[i]);
    i++;
}

3) Делай пока
Делайте, делая то же самое, что и while, с некоторой разницей в синтаксисе, как показано ниже:

let i=0;
do {
  console.log(arr[i]);
  i++;
}
while (arr.length>i);

Это основные способы создания циклов javascript, но есть еще несколько способов сделать это.

Также мы используем цикл for in для зацикливания объектов в javascript.

Также посмотрите на функции map(), filter(), reduce() и т. Д. В массиве в JavaScript. Они могут делать вещи намного быстрее и лучше, чем использовать while и for.

Это хорошая статья, если вы хотите больше узнать об асинхронных функциях над массивами в JavaScript.

Функциональное программирование вызвало всплеск Мир развития в эти дни. И не зря: Функционально методы могут помочь вам написать больше декларативного кода, который легче Понимание, рефакторинг и тестирование.

Одним из краеугольных камней функционального программирования является его специальное использование списков и операций со списками. И это именно то, что звучат так, как они есть: массивы вещей и то, что вы делаете с ними. Но функциональное мышление относится к ним немного иначе, чем к вам. можно ожидать.

В этой статье мы подробно рассмотрим то, что я люблю называть "большой три "списка операций: отображение, фильтрация и уменьшение. Заворачивая голову вокруг этих трех функций является важным шагом к возможности написать чистый функциональный код и открывает двери для мощные приемы функционального и реактивного программирования.

Это также означает, что вам больше никогда не придется писать цикл for.

Читать дальше >> здесь :

Answer 6

Если кого-то интересует производительность нескольких механизмов, доступных для итераций массива, я подготовил следующие тесты JSPerf:

https://jsperf.com/fastest-array-iterator

Результаты:

Традиционный итератор for(), безусловно, является самым быстрым методом, особенно при использовании с кэшированной длиной массива .

let arr = [1,2,3,4,5];

for(let i=0, size=arr.length; i<size; i++){
    // do something
}

Методы Array.prototype.forEach() и Array.prototype.map() представляют собой самые медленные приближения, вероятно, вследствие накладных расходов на вызов функции

Answer 7

Если вы используете библиотеку jQuery, рассмотрите возможность использования http://api.jquery.com/jQuery.each/

Из документации:

jQuery.each( collection, callback(indexInArray, valueOfElement) )

Возвращает: Объект

Описание: Универсальная функция итератора, которую можно использовать для бесшовной итерации как объектов, так и массивов.,Массивы и массоподобные объекты со свойством длины (например, объект аргументов функции) повторяются по числовому индексу от 0 до длины-1.Другие объекты итерируются через свои именованные свойства.

Функция $.each() отличается от $(selector).each(), которая используется исключительно для итерации объекта jQuery.Функцию $.each() можно использовать для перебора любой коллекции, будь то карта (объект JavaScript) или массив.В случае массива обратному вызову каждый раз передается индекс массива и соответствующее значение массива.(К значению также можно получить доступ через ключевое слово this, но Javascript всегда обернет значение this как Object, даже если это простая строка или числовое значение.) Метод возвращает свой первый аргумент, объектэто было повторено.

Answer 8

Я еще не видел этот вариант, который лично мне нравится больше всего:

С учетом массива:

var someArray = ["some", "example", "array"];

Вы можете перебрать его, не обращаясь к свойству длины:

for (var i=0, item; item=someArray[i]; i++) {
  // item is "some", then "example", then "array"
  // i is the index of item in the array
  alert("someArray[" + i + "]: " + item);
}

См. Этот JsFiddle, демонстрирующий, что: http://jsfiddle.net/prvzk/

Это работает только для массивов, которые не разрежены.Это означает, что в каждом индексе массива есть значение.Однако я обнаружил, что на практике я редко использую разреженные массивы в Javascript ... В таких случаях обычно намного проще использовать объект в качестве карты / хеш-таблицы.Если у вас есть разреженный массив, и вы хотите перебрать 0 .. length-1, вам нужен for (var i = 0; i= длина массива, он вернет неопределенный.Когда вы пишете в такое место, оно фактически обновляет длину.

Для меня эта конструкция наиболее близко имитирует синтаксис Java 5, который мне нравится:

for (String item : someArray) {
}

... с помощьюдобавленное преимущество также знания о текущем индексе внутри цикла

Answer 9

Самый элегантный и быстрый способ

var arr = [1, 2, 3, 1023, 1024];
for (var value; value = arr.pop();) {
    value + 1
}

http://jsperf.com/native-loop-performance/8

---

Отредактировано (потому что я был не прав)

---

Сравнение методов для циклического прохождения массива из 100000 элементов и выполнения минимальной операции с новым значением каждый раз.

• http://jsben.ch/#/BQhED

Приготовление:

<script src="//code.jquery.com/jquery-2.1.0.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.6.0/underscore-min.js"></script>
<script>
    Benchmark.prototype.setup = function() {
        // Fake function with minimal action on the value
        var tmp = 0;
        var process = function(value) {
            tmp = value; // Hold a reference to the variable (prevent engine optimisation?)
        };

        // Declare the test Array
        var arr = [];
        for (var i = 0; i < 100000; i++)
            arr[i] = i;
    };
</script>

Тесты:

<a href="http://jsperf.com/native-loop-performance/16" 
   title="http://jsperf.com/native-loop-performance/16"
><img src="http://i.imgur.com/YTrO68E.png" title="Hosted by imgur.com" /></a>

Answer 10

Есть метод для перебора только собственных свойств объекта, не считая свойств прототипа:

for (var i in array) if (array.hasOwnProperty(i)) {
    // do something with array[i]
}

, но он по-прежнему будет перебирать пользовательские свойства.

В JavaScript любое пользовательское свойство может быть назначено любому объекту, включая массив.

Если кто-то хочет перебрать разреженный массив, следует использовать for (var i = 0; i < array.length; i++) if (i in array) или array.forEach с es5shim.