Tablica zwarć. Dla Jak przerwanie połączenia

[1,2,3].forEach(function(el) {
    if(el === 1) break;
});

Jak mogę to zrobić za pomocą nowej forEachmetody w JavaScript? Próbowałem return;, return false;i break.breakulega awarii i returnnie wykonuje nic poza kontynuowaniem iteracji.

Nie ma wbudowanego zdolności breakw forEach. Aby przerwać wykonywanie, musisz rzucić jakiś wyjątek. na przykład.

var BreakException = {};

try {
  [1, 2, 3].forEach(function(el) {
    console.log(el);
    if (el === 2) throw BreakException;
  });
} catch (e) {
  if (e !== BreakException) throw e;
}

Wyjątki JavaScript nie są strasznie ładne. Tradycyjna forpętla może być bardziej odpowiednia, jeśli naprawdę potrzebujesz breakw niej wejść .

Posługiwać się Array#some

Zamiast tego użyj Array#some:

[1, 2, 3].some(function(el) {
  console.log(el);
  return el === 2;
});

Działa to, ponieważ somezwraca truejak najszybciej jakikolwiek callback, wykonywany w kolejności tablicowej, return true, zwiera wykonanie reszty.

some, jego odwrotność every(która zatrzyma się na a return false) i forEachwszystkie metody ECMAScript Piątej Edycji, które trzeba będzie dodać do Array.prototypeprzeglądarek, w których ich brakuje.

Istnieje teraz jeszcze lepszy sposób na wykonanie tego w ECMAScript2015 (alias ES6) przy użyciu nowej pętli for . Na przykład ten kod nie drukuje elementów tablicy po liczbie 5:

let arr = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
for (let el of arr) {
  console.log(el);
  if (el === 5) {
    break;
  }
}

Z dokumentów:

Zarówno dla ... w, jak i ... wypowiedzi iteruje coś. Główna różnica między nimi polega na tym, co powtarzają. Instrukcja for ... iteruje iterowalne policzalne właściwości obiektu w oryginalnej kolejności wstawiania. Instrukcja for ... iteruje dane, dla których obiekt iteracyjny określa iterację.

Potrzebujesz indeksu w iteracji? Możesz użyć Array.entries():

for (const [index, el] of arr.entries()) {
  if ( index === 5 ) break;
}

Możesz użyć każdej metody:

[1,2,3].every(function(el) {
    return !(el === 1);
});

ES6

[1,2,3].every( el => el !== 1 )

do obsługi starej przeglądarki użyj:

if (!Array.prototype.every)
{
  Array.prototype.every = function(fun /*, thisp*/)
  {
    var len = this.length;
    if (typeof fun != "function")
      throw new TypeError();

    var thisp = arguments[1];
    for (var i = 0; i < len; i++)
    {
      if (i in this &&
          !fun.call(thisp, this[i], i, this))
        return false;
    }

    return true;
  };
}

więcej szczegółów tutaj .

Cytowanie z dokumentacji MDNArray.prototype.forEach() :

Nie jest w żaden sposób do zatrzymania lub uszkodzenia w forEach()pętli innych niż wyrzucanie wyjątek. Jeśli potrzebujesz takiego zachowania, .forEach()metoda jest niewłaściwym narzędziem , zamiast tego użyj zwykłej pętli. Jeśli testujesz elementy tablicy dla predykatu i potrzebujesz logicznej wartości zwracanej, możesz użyć every()lub some()zamiast tego.

W swoim kodzie (w pytaniu), zgodnie z sugestią @bobince, użyj Array.prototype.some()zamiast tego. Bardzo dobrze pasuje do twojej skrzynki użytkownika.

Array.prototype.some()wykonuje funkcję wywołania zwrotnego raz dla każdego elementu obecnego w tablicy, dopóki nie znajdzie takiego, w którym wywołanie zwrotne zwraca prawdziwą wartość (wartość, która staje się prawdziwa po przekształceniu w a Boolean). Jeśli taki element zostanie znaleziony, some()natychmiast zwraca wartość true. W przeciwnym razie some()zwraca false. wywołanie zwrotne jest wywoływane tylko dla indeksów tablicy, którym przypisano wartości; nie jest wywoływany dla indeksów, które zostały usunięte lub którym nigdy nie przypisano wartości.

Niestety w tym przypadku będzie znacznie lepiej, jeśli nie użyjesz forEach. Zamiast tego użyj zwykłej forpętli, a teraz będzie działać dokładnie tak, jak można się spodziewać.

var array = [1, 2, 3];
for (var i = 0; i < array.length; i++) {
  if (array[i] === 1){
    break;
  }
}

Rozważ użycie jquery„s eachmetody, ponieważ pozwala na return false wewnątrz funkcji oddzwaniania:

$.each(function(e, i) { 
   if (i % 2) return false;
   console.log(e)
})

Biblioteki Lodash zapewniają również takeWhilemetodę, która może być powiązana z mapą / zmniejszeniem / foldem itp .:

var users = [
  { 'user': 'barney',  'active': false },
  { 'user': 'fred',    'active': false },
  { 'user': 'pebbles', 'active': true }
];

_.takeWhile(users, function(o) { return !o.active; });
// => objects for ['barney', 'fred']

// The `_.matches` iteratee shorthand.
_.takeWhile(users, { 'user': 'barney', 'active': false });
// => objects for ['barney']

// The `_.matchesProperty` iteratee shorthand.
_.takeWhile(users, ['active', false]);
// => objects for ['barney', 'fred']

// The `_.property` iteratee shorthand.
_.takeWhile(users, 'active');
// => []

Z twojego przykładu kodu wygląda Array.prototype.findto, czego szukasz: Array.prototype.find () i Array.prototype.findIndex ()

[1, 2, 3].find(function(el) {
    return el === 2;
}); // returns 2

Jeśli chcesz skorzystać z sugestii Deana Edwarda i rzucić błąd StopIteration, aby wyjść z pętli bez wychwytywania błędu, możesz użyć następującej funkcji ( oryginalnie stąd ):

// Use a closure to prevent the global namespace from be polluted.
(function() {
  // Define StopIteration as part of the global scope if it
  // isn't already defined.
  if(typeof StopIteration == "undefined") {
    StopIteration = new Error("StopIteration");
  }

  // The original version of Array.prototype.forEach.
  var oldForEach = Array.prototype.forEach;

  // If forEach actually exists, define forEach so you can
  // break out of it by throwing StopIteration.  Allow
  // other errors will be thrown as normal.
  if(oldForEach) {
    Array.prototype.forEach = function() {
      try {
        oldForEach.apply(this, [].slice.call(arguments, 0));
      }
      catch(e) {
        if(e !== StopIteration) {
          throw e;
        }
      }
    };
  }
})();

Powyższy kod daje możliwość uruchomienia kodu takiego jak poniżej bez konieczności wykonywania własnych klauzul try-catch:

// Show the contents until you get to "2".
[0,1,2,3,4].forEach(function(val) {
  if(val == 2)
    throw StopIteration;
  alert(val);
});

Należy pamiętać, że spowoduje to aktualizację funkcji Array.prototype.forEach, jeśli już istnieje. Jeśli jeszcze nie istnieje, nie będzie go modyfikować.

Krótka odpowiedź: użyj for...breakdo tego lub zmień kod, aby uniknąć złamania forEach. Nie używaj .some()ani .every()do emulacji for...break. Przepisz kod, aby uniknąć for...breakpętli lub użyj for...break. Za każdym razem, gdy używasz tych metod jako for...breakalternatywnego, Bóg zabija kociaka.

Długa odpowiedź:

.some()i .every()obie zwracają booleanwartość, .some()zwraca, truejeśli istnieje jakikolwiek element, dla którego przekazana funkcja zwraca true, każde zwracafalse jeśli istnieje jakikolwiek element, dla którego przekazana funkcja zwracafalse . To właśnie oznaczają te funkcje. Używanie funkcji do tego, co nie oznaczają, jest znacznie gorsze niż używanie tabel do układu zamiast CSS, ponieważ frustruje każdego, kto czyta twój kod.

Ponadto jedynym możliwym sposobem wykorzystania tych metod jako for...breakalternatywy jest .some()wywołanie efektów ubocznych (zmiana niektórych zmiennych poza funkcją wywołania zwrotnego), i to niewiele różni się odfor...break .

Zatem użycie .some()lub .every()jako for...breakalternatywa pętli nie jest wolna od skutków ubocznych, nie jest to wtedy dużo czystszefor...break , jest to frustrujące, więc nie jest lepiej.

Zawsze możesz przepisać kod, aby nie było potrzeby for...break. Możesz filtrować tablicę za pomocą .filter(), możesz podzielić tablicę za pomocą .slice()i tak dalej, następnie użyj .forEach()lub .map()dla tej części tablicy.

To jest coś, co wymyśliłem, aby rozwiązać problem ... Jestem prawie pewien, że rozwiązuje problem, który miał pierwotny pytający:

Array.prototype.each = function(callback){
    if(!callback) return false;
    for(var i=0; i<this.length; i++){
        if(callback(this[i], i) == false) break;
    }
};

A potem nazwałbyś to używając:

var myarray = [1,2,3];
myarray.each(function(item, index){
    // do something with the item
    // if(item != somecondition) return false; 
});

Zwrócenie wartości false w funkcji wywołania zwrotnego spowoduje przerwanie. Daj mi znać, jeśli to nie zadziała.

Kolejna koncepcja, którą wymyśliłem:

function forEach(array, cb) {
  var shouldBreak;
  function _break() { shouldBreak = true; }
  for (var i = 0, bound = array.length; i < bound; ++i) {
    if (shouldBreak) { break; }
    cb(array[i], i, array, _break);
  }
}

// Usage

forEach(['a','b','c','d','e','f'], function (char, i, array, _break) {
  console.log(i, char);
  if (i === 2) { _break(); }
});

Znalazłem to rozwiązanie w innej witrynie. Możesz owinąć forEach w scenariuszu try / catch.

if(typeof StopIteration == "undefined") {
 StopIteration = new Error("StopIteration");
}

try {
  [1,2,3].forEach(function(el){
    alert(el);
    if(el === 1) throw StopIteration;
  });
} catch(error) { if(error != StopIteration) throw error; }

Więcej informacji tutaj: http://dean.edwards.name/weblog/2006/07/enum/

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

for(var item of array){
    console.log(item);
    if(item == 2){
       break;
    }
}

Jeśli nie potrzebujesz dostępu do tablicy po iteracji, możesz wyskoczyć, ustawiając długość tablicy na 0. Jeśli nadal potrzebujesz jej po iteracji, możesz ją sklonować za pomocą plasterka.

[1,3,4,5,6,7,8,244,3,5,2].forEach(function (item, index, arr) {
  if (index === 3) arr.length = 0;
});

Lub z klonem:

var x = [1,3,4,5,6,7,8,244,3,5,2];

x.slice().forEach(function (item, index, arr) {
  if (index === 3) arr.length = 0;
});

Co jest znacznie lepszym rozwiązaniem niż zgłaszanie przypadkowych błędów w kodzie.

To jest pętla for, ale zachowuje odwołanie do obiektu w pętli, podobnie jak forEach (), ale możesz się wyrwać.

var arr = [1,2,3];
for (var i = 0, el; el = arr[i]; i++) {
    if(el === 1) break;
}

Jak wspomniano wcześniej, nie możesz się złamać .forEach().

Oto nieco bardziej nowoczesny sposób wykonywania foreach za pomocą Iteratorów ES6. Umożliwia bezpośredni dostęp do index/ valuepodczas iteracji.

const array = ['one', 'two', 'three'];

for (const [index, val] of array.entries()) {
  console.log('item:', { index, val });
  if (index === 1) {
    console.log('break!');
    break;
  }
}

Wynik:

item: { index: 0, val: 'one' }
item: { index: 1, val: 'two' }
break!

Spinki do mankietów

• Array.prototype.entries()
• Iteratory i generatory
• Zadanie dotyczące restrukturyzacji

Jeszcze inne podejście

        var wageType = types.filter(function(element){
            if(e.params.data.text == element.name){ 
                return element;
            }
        });
        console.dir(wageType);

W tym celu używam nullhack , próbuje uzyskać dostęp do właściwości null, która jest błędem:

try {
  [1,2,3,4,5]
  .forEach(
    function ( val, idx, arr ) {
      if ( val == 3 ) null.NULLBREAK;
    }
  );
} catch (e) {
  // e <=> TypeError: null has no properties
}
//

Jeśli chcesz zachować forEach składnię, jest to sposób na utrzymanie jej wydajności (chociaż nie jest tak dobry jak zwykła pętla for). Natychmiast sprawdź zmienną, która wie, czy chcesz wyjść z pętli.

W tym przykładzie użyto funkcji anonimowej do utworzenia zakresu funkcji, wokół forEachktórego należy przechowywać wykonane informacje.

(function(){
    var element = document.getElementById('printed-result');
    var done = false;
    [1,2,3,4].forEach(function(item){
        if(done){ return; }
        var text = document.createTextNode(item);
        element.appendChild(text);
        if (item === 2){
          done = true;
          return;
        }
    });
})();

<div id="printed-result"></div>

Moje dwa centy.

Wiem, że to nie w odpowiedni sposób. To nie jest przerwa w pętli. To jest Jugad

let result = true;
[1, 2, 3].forEach(function(el) {
    if(result){
      console.log(el);
      if (el === 2){
        result = false;
      }
    }
});

Użyj array.prototype.everyfunkcji, która udostępnia narzędzie do przerwania pętli. Zobacz przykład tutaj dokumentację Javascript w sieci deweloperów Mozilla

Zgadzam się z @bobince, przegłosowałem.

Również FYI:

Prototype.js ma coś w tym celu:

<script type="text/javascript">
  $$('a').each(function(el, idx) {
    if ( /* break condition */ ) throw $break;
    // do something
  });
</script>

$break zostanie przechwycony i obsłużony przez Prototype.js wewnętrznie, przerywając „każdy” cykl, ale nie generując błędów zewnętrznych.

Aby uzyskać szczegółowe informacje, zobacz Prototype.JS API .

jQuery ma również sposób, po prostu zwróć false w module obsługi, aby wcześniej przerwać pętlę:

<script type="text/javascript">
  jQuery('a').each( function(idx) {
    if ( /* break condition */ ) return false;
    // do something

  });
</script>

Szczegółowe informacje można znaleźć w interfejsie API jQuery .

Nie jest to najbardziej wydajne, ponieważ nadal cyklicznie wszystkie elementy, ale pomyślałem, że warto rozważyć bardzo proste:

let keepGoing = true;
things.forEach( (thing) => {
  if (noMore) keepGoing = false;
  if (keepGoing) {
     // do things with thing
  }
});

możesz postępować zgodnie z poniższym kodem, który działa dla mnie:

 var     loopStop = false;
YOUR_ARRAY.forEach(function loop(){
    if(loopStop){ return; }
    if(condition){ loopStop = true; }
});

Wolę używać for in

var words = ['a', 'b', 'c'];
var text = '';
for (x in words) {
    if (words[x] == 'b') continue;
    text += words[x];
}
console.log(text);

for indziała podobnie forEach, i możesz dodać funkcję powrotu do wyjścia w środku. Również lepsza wydajność.

Jeśli potrzebujesz przerwać na podstawie wartości elementów, które są już w twojej tablicy, tak jak w twoim przypadku (tj. Jeśli warunek przerwania nie zależy od zmiennej czasu wykonywania, która może się zmienić po przypisaniu tablicy wartości jej elementów), możesz również użyć kombinacji funkcji slice () i indexOf () w następujący sposób.

Jeśli musisz przerwać, gdy forEach osiągnie „Apple”, możesz użyć

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var fruitsToLoop = fruits.slice(0, fruits.indexOf("Apple"));
// fruitsToLoop = Banana,Orange,Lemon

fruitsToLoop.forEach(function(el) {
    // no need to break
});

Jak stwierdzono w W3Schools.com metoda slice () zwraca wybrane elementy w tablicy, jako nowy obiekt tablicy. Oryginalna tablica nie zostanie zmieniona.

Zobacz to w JSFiddle

Mam nadzieję, że to komuś pomoże.

Można utworzyć wariant forEach, który pozwala na break, continue, return, a nawet async/ await: (przykład napisany na maszynie)

export type LoopControlOp = "break" | "continue" | ["return", any];
export type LoopFunc<T> = (value: T, index: number, array: T[])=>LoopControlOp;

Array.prototype.ForEach = function ForEach<T>(this: T[], func: LoopFunc<T>) {
    for (let i = 0; i < this.length; i++) {
        const controlOp = func(this[i], i, this);
        if (controlOp == "break") break;
        if (controlOp == "continue") continue;
        if (controlOp instanceof Array) return controlOp[1];
    }
};

// this variant lets you use async/await in the loop-func, with the loop "awaiting" for each entry
Array.prototype.ForEachAsync = async function ForEachAsync<T>(this: T[], func: LoopFunc<T>) {
    for (let i = 0; i < this.length; i++) {
        const controlOp = await func(this[i], i, this);
        if (controlOp == "break") break;
        if (controlOp == "continue") continue;
        if (controlOp instanceof Array) return controlOp[1];
    }
};

Stosowanie:

function GetCoffee() {
    const cancelReason = peopleOnStreet.ForEach((person, index)=> {
        if (index == 0) return "continue";
        if (person.type == "friend") return "break";
        if (person.type == "boss") return ["return", "nevermind"];
    });
    if (cancelReason) console.log("Coffee canceled because: " + cancelReason);
}

spróbuj z „znajdź”:

var myCategories = [
 {category: "start", name: "Start", color: "#AC193D"},
 {category: "action", name: "Action", color: "#8C0095"},
 {category: "exit", name: "Exit", color: "#008A00"}
];

function findCategory(category) {
  return myCategories.find(function(element) {
    return element.category === category;
  });
}

console.log(findCategory("start"));
// output: { category: "start", name: "Start", color: "#AC193D" }

Tak, można kontynuować i wyjść z pętli forEach.

Aby kontynuować, możesz użyć return, pętla będzie kontynuowana, ale bieżąca funkcja się zakończy.

Aby wyjść z pętli, możesz ustawić trzeci parametr na 0, ustawić pustą tablicę. Pętla nie będzie kontynuowana, obecna funkcja tak, więc możesz użyć „return”, aby zakończyć, jak wyjście w normalnej pętli for ...

To:

[1,2,3,4,5,6,7,8,9,10].forEach((a,b,c) => {
    console.log(a);
    if(b == 2){return;}
    if(b == 4){c.length = 0;return;}
    console.log("next...",b);
});

wydrukuje to:

1
next... 0
2
next... 1
3
4
next... 3
5

Wcześniej mój kod był poniżej

 this.state.itemsDataSource.forEach((item: any) => {
                if (!item.isByPass && (item.invoiceDate == null || item.invoiceNumber == 0)) {

                    return false;
                }
            });

Zmieniłem poniżej, zostało to naprawione.

 for (var i = 0; i < this.state.itemsDataSource.length; i++) {
                var item = this.state.itemsDataSource[i];
                if (!item.isByPass && (item.invoiceDate == null || item.invoiceNumber == 0)) {

                    return false;
                }
            }