Come fermare un ciclo JavaScript for?


128

Sto usando questo JavaScript per scorrere un array e trovare un elemento di array corrispondente:

var remSize = [], 
    szString, remData, remIndex, i;

for (i = 0; i < remSize.length; i++) {      
    // I'm looking for the index i, when the condition is true
    remSize[i].size == remData.size ? remIndex = i : remIndex = -1;     
}

L'array contiene questi "taglie": ["34", "36", "38"...].

remData.size è la "taglia" che sto cercando (ad esempio "36").

Devo restituire l'indice ise la dimensione che sto cercando è nell'indice. Altrimenti devo tornare -1. C'è un modo migliore per farlo?

Risposte:


194

Per interrompere un forciclo all'inizio in JavaScript, utilizzare break:

var remSize = [], 
    szString,
    remData,
    remIndex,
    i;

/* ...I assume there's code here putting entries in `remSize` and assigning something to `remData`... */

remIndex = -1; // Set a default if we don't find it
for (i = 0; i < remSize.length; i++) {      
     // I'm looking for the index i, when the condition is true
     if (remSize[i].size === remData.size) {
          remIndex = i;
          break;       // <=== breaks out of the loop early
     }
}

Se ti trovi in ​​un ambiente ES2015 (noto anche come ES6), per questo caso d'uso specifico , puoi usare Array#findIndex(per trovare l'indice della voce) o Array#find(per trovare la voce stessa), entrambi possono essere shimati / polyfilled:

var remSize = [], 
    szString,
    remData,
    remIndex;

/* ...I assume there's code here putting entries in `remSize` and assigning something to `remData`... */

remIndex = remSize.findIndex(function(entry) {
     return entry.size === remData.size;
});

Array#find:

var remSize = [], 
    szString,
    remData,
    remEntry;

/* ...I assume there's code here putting entries in `remSize` and assigning something to `remData`... */

remEntry = remSize.find(function(entry) {
     return entry.size === remData.size;
});

Array#findIndexsi ferma la prima volta che il callback restituisce un valore true, restituendo l'indice per quella chiamata al callback; restituisce -1se il callback non restituisce mai un valore vero. Array#findsi ferma anche quando trova quello che stai cercando, ma restituisce la voce, non il suo indice (o undefinedse il callback non restituisce mai un valore veritiero).

Se stai utilizzando un ambiente compatibile con ES5 (o uno shim ES5), puoi utilizzare la nuova somefunzione sugli array, che chiama un callback finché il callback non restituisce un valore vero:

var remSize = [], 
    szString,
    remData,
    remIndex;

/* ...I assume there's code here putting entries in `remSize` and assigning something to `remData`... */

remIndex = -1; // <== Set a default if we don't find it
remSize.some(function(entry, index) {
    if (entry.size === remData.size) {
        remIndex = index;
        return true; // <== Equivalent of break for `Array#some`
    }
});

Se stai usando jQuery, puoi usare jQuery.eachper scorrere un array; sarebbe simile a questo:

var remSize = [], 
    szString,
    remData,
    remIndex;

/* ...I assume there's code here putting entries in `remSize` and assigning something to `remData`... */

remIndex = -1; // <== Set a default if we don't find it
jQuery.each(remSize, function(index, entry) {
    if (entry.size === remData.size) {
        remIndex = index;
        return false; // <== Equivalent of break for jQuery.each
    }
});

1
l'utilizzo dell'istruzione return è un buon approccio. Grazie @TJ Crowder
techloris_109

@TJ Crowder quale affermazione è un buon approccio: restituisci falso o interrompi?
Ilyas karim

3
@ Ilyaskarim: usi quello appropriato al costrutto che stai usando ( breakin un forloop, return falsein jQuery.each, return truein some, ...).
TJ Crowder

13

Utilizzare invece for of loop che fa parte della versione ES2015. A differenza di forEach, possiamo usare return, break e continue. Vedi https://hacks.mozilla.org/2015/04/es6-in-depth-iterators-and-the-for-of-loop/

let arr = [1,2,3,4,5];
for (let ele of arr) {
  if (ele > 3) break;
  console.log(ele);
}

buon uso di es6, penso che questa sia una delle migliori risposte qui
Emad Salah

In effetti, direi che è LA migliore risposta qui - in gran parte il modo più accurato di farlo ("la sintassi più concisa e diretta finora per il ciclo attraverso gli elementi dell'array", come dice Mozilla Hacks nel link nella risposta). Dovremmo ripagare tutto il duro lavoro svolto in ES6 facendo uso delle sue nuove funzionalità ovunque possiamo (e beneficiando noi stessi nel processo).
Velojet

10

La logica non è corretta. Restituirà sempre il risultato dell'ultimo elemento dell'array.

remIndex = -1;

for (i = 0; i < remSize.length; i++) {      
    if (remSize[i].size == remData.size) {
        remIndex = i
        break;
    }
}

0

So che è un po 'vecchio, ma invece di scorrere l'array con un ciclo for, sarebbe molto più facile usare il metodo <array>.indexOf(<element>[, fromIndex])

Esegue un ciclo attraverso un array, trovando e restituendo il primo indice di un valore. Se il valore non è contenuto nell'array, restituisce -1.

<array>è l'array da esaminare, <element>è il valore che stai cercando ed [fromIndex]è l'indice da cui partire (il valore predefinito è 0).

Spero che questo aiuti a ridurre le dimensioni del tuo codice!


1
Questo non risponde alla domanda del titolo: How to stop a JavaScript for loop?Si fa risposta Esiste un modo migliore per restituire l'indice di una partita / -1 se nessuno .
barba grigia
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.