Eu estou tentando fazer um loop através de uma matriz. Eu tenho o seguinte código:

 var currnt_image_list= '21,32,234,223';
 var substr = currnt_image_list.split(','); // array here

Estou tentando obter todos os dados fora da matriz. Alguém pode me levar no caminho certo, por favor?

(Atualização: Minha outra resposta aqui apresenta as opções que não são do jQuery jQuery.each.

Quatro opções:

Loop genérico:

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

ou no ES2015 +:

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

Vantagens : Direto, sem dependência do jQuery, fácil de entender, sem problemas com a preservação do significado do thiscorpo do loop, sem sobrecarga desnecessária de chamadas de função (por exemplo, em teoria mais rapidamente, embora na verdade você precise tem tantos elementos que as chances são de que você teria outros problemas; detalhes ).

ES5 forEach:

No ECMAScript5, as matrizes têm uma forEachfunção que facilita o loop pela matriz:

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

Link para documentos

(Nota: existem muitas outras funções, não apenas forEach; consulte a resposta mencionada acima para obter detalhes.)

Vantagens : Declarativa, você pode usar uma função pré-construída para o iterador, se você tiver uma útil, se o corpo do seu loop for complexo, o escopo de uma chamada de função às vezes é útil, sem necessidade de uma ivariável no seu escopo.

Desvantagens : Se você estiver usando thisno código que contém e que deseja usar thisdentro de seu forEachretorno, você tem que quer A) Cole-o em uma variável de modo que você pode usá-lo dentro da função, B) Passe-o como um segundo argumento para forEachassim forEachdefine como thisdurante o retorno de chamada, ou C) Use uma função de seta ES2015 + , que fecha this. Se você não fizer uma dessas coisas, o retorno de chamada thisserá undefined(no modo estrito) ou o objeto global ( window) no modo frouxo. Costumava haver uma segunda desvantagem que forEachnão era universalmente suportada, mas aqui em 2018, o único navegador em que você se depara que não possui forEaché o IE8 (e não pode ser adequadamente lá também).

ES2015 + for-of:

for (const s of substr) { // Or `let` if you want to modify it in the loop body
    // do something with `s`
}

Veja a resposta vinculada na parte superior desta resposta para obter detalhes sobre como isso funciona.

Vantagens : Simples, direto, oferece uma variável de escopo contido (ou constante, acima) para a entrada da matriz.

Desvantagens : Não suportado em nenhuma versão do IE.

jQuery.each:

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

( Link para documentos )

Vantagens : Todas as mesmas vantagens que forEach, além de você saber que existe desde que você está usando o jQuery.

Desvantagens : Se você estiver usando thiso código que contém, precisará inseri-lo em uma variável para poder usá-lo dentro da função, pois thissignifica algo mais dentro da função.

Você pode evitar thisisso, usando $.proxy:

jQuery.each(substr, $.proxy(function(index, item) {
    // do something with `item` (`this` is the same as it was outside)
}, this));

... ou Function#bind:

jQuery.each(substr, function(index, item) {
    // do something with `item` (`this` is the same as it was outside)
}.bind(this));

... ou no ES2015 ("ES6"), uma função de seta:

jQuery.each(substr, (index, item) => {
    // do something with `item` (`this` is the same as it was outside)
});

O que NÃO fazer:

Não use for..inpara isso (ou, se o fizer, faça-o com as devidas salvaguardas). Você verá pessoas dizendo (de fato, brevemente houve uma resposta aqui dizendo isso), mas for..innão faz o que muitas pessoas pensam que faz (faz algo ainda mais útil!). Especificamente, for..inpercorre os nomes de propriedades enumeráveis ​​de um objeto (não os índices de uma matriz). Como matrizes são objetos e suas únicas propriedades enumeráveis, por padrão, são os índices, geralmente parece que funciona em uma implantação branda. Mas não é uma suposição segura de que você pode usá-lo para isso. Aqui está uma exploração: http://jsbin.com/exohi/3

Eu deveria suavizar o "não" acima. Se você estiver lidando com matrizes esparsas (por exemplo, a matriz possui 15 elementos no total, mas seus índices estão espalhados pelo intervalo de 0 a 150.000 por algum motivo, e por isso lengthé 150.001), e se você usar salvaguardas apropriadas como hasOwnPropertye verificar as O nome da propriedade é realmente numérico (veja o link acima), for..inpode ser uma maneira perfeitamente razoável de evitar muitos loops desnecessários, pois apenas os índices preenchidos serão enumerados.

jQuery.each ()

jQuery.each ()

jQuery.each(array, callback)

iteração de matriz

jQuery.each(array, function(Integer index, Object value){});

iteração de objeto

jQuery.each(object, function(string propertyName, object propertyValue){});

exemplo :

var substr = [1, 2, 3, 4];
$.each(substr , function(index, val) { 
  console.log(index, val)
});

var myObj = { firstName: "skyfoot"};
$.each(myObj, function(propName, propVal) {
  console.log(propName, propVal);
});

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

loops de javascript para matriz

para laço

for (initialExpression; condition; incrementExpression)
  statement

exemplo

var substr = [1, 2, 3, 4];

//loop from 0 index to max index
for(var i = 0; i < substr.length; i++) {
  console.log("loop", substr[i])
}

//reverse loop
for(var i = substr.length-1; i >= 0; i--) {
  console.log("reverse", substr[i])
}

//step loop
for(var i = 0; i < substr.length; i+=2) {
  console.log("step", substr[i])
}

para em

//dont really wnt to use this on arrays, use it on objects
for(var i in substr) {
    console.log(substr[i]) //note i returns index
}

para de

for(var i of subs) {
    //can use break;
    console.log(i); //note i returns value
}

para cada

substr.forEach(function(v, i, a){
    //cannot use break;
    console.log(v, i, a);
})

Recursos

Loops e iteradores MDN

Não há necessidade de jquery aqui, apenas um forloop funciona:

var substr = currnt_image_list.split(',');
for(var i=0; i< substr.length; i++) {
  alert(substr[i]);
}

Opção 1: O forlaço tradicional

O básico

Um forloop tradicional possui três componentes:

1. a inicialização: executada antes da primeira execução do bloco de aparência
2. a condição: verifica uma condição sempre que o bloco de loop é executado e sai do loop se falso
3. o pensamento tardio: executado sempre que o bloco de loop é executado

Esses três componentes são separados um do outro por um ;símbolo. O conteúdo de cada um desses três componentes é opcional, o que significa que o seguinte é o forloop mínimo possível:

for (;;) {
    // Do stuff
}

Obviamente, você precisará incluir um if(condition === true) { break; } ou um local if(condition === true) { return; }dentro desse forloop para que ele pare de funcionar.

Geralmente, porém, a inicialização é usada para declarar um índice, a condição é usada para comparar esse índice com um valor mínimo ou máximo, e a reflexão posterior é usada para incrementar o índice:

for (var i = 0, length = 10; i < length; i++) {
    console.log(i);
}

Usando um forlaço tradicional para percorrer uma matriz

A maneira tradicional de fazer um loop através de uma matriz é esta:

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

Ou, se você preferir fazer um loop para trás, faça o seguinte:

for (var i = myArray.length - 1; i > -1; i--) {
    console.log(myArray[i]);
}

Existem, no entanto, muitas variações possíveis, como por exemplo. este :

for (var key = 0, value = myArray[key], var length = myArray.length; key < length; value = myArray[++key]) {
    console.log(value);
}

... ou este ...

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

... ou este:

var key = 0, value;
for (; value = myArray[key++];){ 
    console.log(value);
}

O que funcionar melhor é em grande parte uma questão de gosto pessoal e do caso de uso específico que você está implementando.

Cada uma dessas variações é suportada por todos os navegadores, incluindo vários antigos!

Opção 2: O whileloop

Uma alternativa para um forloop é um whileloop. Para percorrer uma matriz, você pode fazer o seguinte:

var key = 0;
while(value = myArray[key++]){
    console.log(value);
}

Como os tradicionais forloops, os whileloops são suportados até pelos navegadores mais antigos.

Além disso, o loop while pode ser reescrito como um loop for. Por exemplo, o whileloop acima se comporta exatamente da mesma maneira que este forloop:

for(var key = 0;value = myArray[key++];){
    console.log(value);
}

Opção 3: for...inefor...of

Em JavaScript, você também pode fazer isso:

for (i in myArray) {
    console.log(myArray[i]);
}

No entanto, isso deve ser usado com cuidado, pois não se comporta da mesma forma que um forlaço tradicional em todos os casos, e existem possíveis efeitos colaterais que precisam ser considerados. Consulte Por que usar "for ... in" com iteração de matriz é uma má idéia? para mais detalhes.

Como alternativa for...in, agora também existe for...of. O exemplo a seguir mostra a diferença entre um for...ofloop e um for...inloop:

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
}

Você também precisa considerar que nenhuma versão do Internet Explorer suporta for...of( Edge 12+ ) e que for...inrequer pelo menos o IE10.

Opção 4: Array.prototype.forEach()

Uma alternativa para For-loops é Array.prototype.forEach(), que usa a seguinte sintaxe:

myArray.forEach(function(value, key, myArray) {
    console.log(value);
});

Array.prototype.forEach() é suportado por todos os navegadores modernos, bem como pelo IE9 +.

Opção 5: jQuery.each()

Além das quatro outras opções mencionadas, o jQuery também teve sua própria foreachvariação.

Ele usa a seguinte sintaxe:

$.each(myArray, function(key, value) {
    console.log(value);
});

Use a each()função do jQuery.

Aqui está um exemplo:

$.each(currnt_image_list.split(','), function(index, value) { 
  alert(index + ': ' + value); 
});

Use jQuery each(). Existem outras maneiras, mas cada uma delas foi projetada para esse fim.

$.each(substr, function(index, value) { 
  alert(value); 
});

E não coloque a vírgula após o último número.

Você pode usar um for()loop:

var things = currnt_image_list.split(','); 
for(var i = 0; i < things.length; i++) {
    //Do things with things[i]
}

Sintaxe ES6 com função de seta e interpolação:

var data=["a","b","c"];
$(data).each((index, element) => {
        console.log(`current index : ${index} element : ${element}`)
    });

Tente o seguinte:

$.grep(array, function(element) {

})

Maneiras alternativas de iteração através de array / string com efeitos colaterais

var str = '21,32,234,223';
var substr = str.split(',');

substr.reduce((a,x)=> console.log('reduce',x), 0)        // return undefined

substr.every(x=> { console.log('every',x); return true}) // return true

substr.some(x=> { console.log('some',x); return false})  // return false

substr.map(x=> console.log('map',x));                    // return array
 
str.replace(/(\d+)/g, x=> console.log('replace',x))      // return string