Kurzschluss Array.forJeder wie Call Break

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

Wie kann ich dies mit der neuen forEachMethode in JavaScript tun ? Ich habe versucht return;, return false;und break. breakstürzt ab und returnmacht nichts anderes als die Iteration fortzusetzen.

Es gibt keine eingebaute Fähigkeit zu breakin forEach. Um die Ausführung zu unterbrechen, müssten Sie eine Ausnahme auslösen. z.B.

var BreakException = {};

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

JavaScript-Ausnahmen sind nicht besonders hübsch. Eine herkömmliche forSchleife ist möglicherweise besser geeignet, wenn Sie sie wirklich benötigen break.

Verwenden Array#some

Verwenden Sie stattdessen Array#some:

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

Dies funktioniert, weil somezurückgegeben wird true, sobald einer der in Array-Reihenfolge ausgeführten Rückrufe zurückkehrt trueund die Ausführung des Restes kurzschließt.

some, es ist invers every(was bei a stoppt return false) und forEachsind alle ECMAScript Fifth Edition-Methoden, die zu den Array.prototypeOn-Browsern hinzugefügt werden müssen, in denen sie fehlen.

In ECMAScript2015 (auch bekannt als ES6) gibt es jetzt eine noch bessere Möglichkeit, dies mit der neuen for of-Schleife zu tun . Beispielsweise druckt dieser Code die Array-Elemente nach der Nummer 5 nicht:

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;
  }
}

Aus den Dokumenten:

Sowohl für ... in als auch für ... von Aussagen iterieren über etwas. Der Hauptunterschied zwischen ihnen besteht darin, worüber sie iterieren. Die for ... in- Anweisung durchläuft die aufzählbaren Eigenschaften eines Objekts in der ursprünglichen Einfügereihenfolge. Die for ... of- Anweisung iteriert über Daten, über die das iterierbare Objekt iteriert.

Benötigen Sie den Index in der Iteration? Sie können verwenden Array.entries():

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

Sie können jede Methode verwenden:

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

ES6

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

für die Unterstützung alter Browser:

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;
  };
}

Weitere Details hier .

Zitat aus der MDN-Dokumentation vonArray.prototype.forEach() :

Es gibt keineforEach() andere Möglichkeit, eine Schleife anzuhalten oder zu unterbrechen, als eine Ausnahme auszulösen. Wenn Sie ein solches Verhalten benötigen, ist die .forEach()Methode das falsche Werkzeug . Verwenden Sie stattdessen eine einfache Schleife. Wenn Sie die Array-Elemente auf ein Prädikat testen und einen booleschen Rückgabewert benötigen, können Sie verwendenevery() oder some()stattdessen verwenden.

Verwenden Sie Array.prototype.some()stattdessen für Ihren Code (in der Frage), wie von @bobince vorgeschlagen . Es passt sehr gut zu Ihrem Anwendungsfall.

Array.prototype.some()führt die Rückruffunktion einmal für jedes im Array vorhandene Element aus, bis es eines findet, bei dem der Rückruf einen wahrheitsgemäßen Wert zurückgibt (einen Wert, der wahr wird, wenn er in a konvertiert wird Boolean). Wenn ein solches Element gefunden wird, wird some()sofort true zurückgegeben. Andernfalls wird some()false zurückgegeben. Der Rückruf wird nur für Indizes des Arrays aufgerufen, denen Werte zugewiesen wurden. Es wird nicht für Indizes aufgerufen, die gelöscht wurden oder denen nie Werte zugewiesen wurden.

Leider ist es in diesem Fall viel besser, wenn Sie nicht verwenden forEach. Verwenden Sie stattdessen eine reguläre forSchleife, die jetzt genau so funktioniert, wie Sie es erwarten würden.

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

Erwägen Sie die Verwendung jqueryder eachMethode von ', da sie die Rückgabe von false innerhalb der Rückruffunktion ermöglicht:

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

Lodash-Bibliotheken bieten auch takeWhileMethoden, die mit map / redu / fold etc verkettet werden können:

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');
// => []

Aus Ihrem Codebeispiel Array.prototype.findgeht hervor, wonach Sie suchen: Array.prototype.find () und Array.prototype.findIndex ()

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

Wenn Sie den Vorschlag von Dean Edward verwenden und den StopIteration-Fehler auslösen möchten, um aus der Schleife auszubrechen, ohne den Fehler abfangen zu müssen, können Sie die folgende Funktion verwenden ( ursprünglich von hier ):

// 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;
        }
      }
    };
  }
})();

Mit dem obigen Code können Sie Code wie den folgenden ausführen, ohne Ihre eigenen Try-Catch-Klauseln ausführen zu müssen:

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

Beachten Sie, dass dadurch die Funktion Array.prototype.forEach nur aktualisiert wird, wenn sie bereits vorhanden ist. Wenn es noch nicht vorhanden ist, wird es nicht geändert.

Kurze Antwort: Verwenden Sie for...breakdiese Option oder ändern Sie Ihren Code, um ein Brechen zu vermeiden forEach. Nicht verwenden .some()oder .every()emulieren for...break. Schreiben Sie Ihren Code neu, um for...breakSchleifen zu vermeiden , oder verwenden Sie ihn for...break. Jedes Mal, wenn Sie diese Methoden als for...breakAlternative verwenden, tötet Gott Kätzchen.

Lange Antwort:

.some()und .every()beide geben den booleanWert .some()zurück, truewenn ein Element zurückgegeben wird, für das die übergebene Funktion zurückgegeben wurde true, und jedes, falsewenn ein Element zurückgegeben wird, für das die übergebene Funktion zurückgegeben wurde false. Das ist es, was diese Funktionen bedeuten. Die Verwendung von Funktionen für das, was sie nicht bedeuten, ist viel schlimmer als die Verwendung von Tabellen für das Layout anstelle von CSS, da dies jeden frustriert, der Ihren Code liest.

Die einzige Möglichkeit, diese Methoden als for...breakAlternative zu verwenden, besteht darin, Nebenwirkungen zu verursachen (einige Variablen außerhalb der .some()Rückruffunktion zu ändern ), und dies unterscheidet sich nicht wesentlich von for...break.

Die Verwendung von .some()oder .every()als for...breakLoop-Alternative ist also nicht frei von Nebenwirkungen. Dies ist dann nicht viel sauberer for...break. Dies ist frustrierend und daher nicht besser.

Sie können Ihren Code jederzeit neu schreiben, sodass keine Notwendigkeit besteht for...break. Sie können das Array mit filtern .filter(), das Array mit .slice()usw. teilen und dann .forEach()oder .map()für diesen Teil des Arrays verwenden.

Dies ist nur etwas, das ich mir ausgedacht habe, um das Problem zu lösen ... Ich bin mir ziemlich sicher, dass es das Problem behebt, das der ursprüngliche Fragesteller hatte:

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

Und dann würden Sie es nennen, indem Sie verwenden:

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

Die Rückgabe von false innerhalb der Rückruffunktion führt zu einer Unterbrechung. Lassen Sie mich wissen, wenn das nicht funktioniert.

Ein anderes Konzept, das ich mir ausgedacht habe:

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(); }
});

Diese Lösung wurde auf einer anderen Site gefunden. Sie können forEach in ein Try / Catch-Szenario einschließen.

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; }

Weitere Details hier: 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;
    }
}

Wenn Sie nach der Iteration nicht auf Ihr Array zugreifen müssen, können Sie aussteigen, indem Sie die Länge des Arrays auf 0 setzen. Wenn Sie es nach Ihrer Iteration noch benötigen, können Sie es mit Slice klonen.

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

Oder mit einem Klon:

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;
});

Das ist eine weitaus bessere Lösung, als zufällige Fehler in Ihren Code zu werfen.

Dies ist eine for-Schleife, behält jedoch die Objektreferenz in der Schleife wie forEach () bei, aber Sie können ausbrechen.

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

Wie bereits erwähnt, können Sie nicht brechen .forEach() .

Hier ist eine etwas modernere Methode, um mit ES6-Iteratoren einen Foreach durchzuführen. Ermöglicht den direkten Zugriff auf index/ valuebeim Iterieren.

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

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

Ausgabe:

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

Links

• Array.prototype.entries()
• Iteratoren und Generatoren
• Zerstörungsauftrag

Noch ein Ansatz

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

Ich benutze nullhack für diesen Zweck, es versucht, auf die Eigenschaft von zuzugreifen null, was ein Fehler ist:

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

Wenn du deine behalten willst forEach Syntax diese Weise effizient halten (obwohl sie nicht so gut ist wie eine reguläre for-Schleife). Suchen Sie sofort nach einer Variablen, die weiß, ob Sie aus der Schleife ausbrechen möchten.

In diesem Beispiel wird eine anonyme Funktion zum Erstellen eines Funktionsbereichs verwendet, um den forEachSie die erledigten Informationen speichern müssen .

(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>

Meine zwei Cent.

Ich weiß es nicht richtig. Es ist nicht die Schleife zu brechen. Es ist ein Jugad

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

Verwenden Sie die array.prototype.everyFunktion, mit der Sie die Schleife unterbrechen können. Siehe Beispiel hier Javascript-Dokumentation im Mozilla-Entwicklernetzwerk

Stimmen Sie mit @bobince überein, gestimmt.

Auch zu Ihrer Information:

Prototype.js hat etwas für diesen Zweck:

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

$break wird von Prototype.js intern abgefangen und verarbeitet, wodurch der "jeder" Zyklus unterbrochen wird, jedoch keine externen Fehler generiert werden.

Weitere Informationen finden Sie unter Prototype.JS-API .

jQuery hat auch eine Möglichkeit, einfach false im Handler zurückzugeben, um die Schleife frühzeitig zu unterbrechen:

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

  });
</script>

Weitere Informationen finden Sie unter jQuery-API .

Dies ist nicht die effizienteste, da Sie immer noch alle Elemente durchlaufen, aber ich dachte, es könnte sich lohnen, das sehr einfache zu betrachten:

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

Sie können dem folgenden Code folgen, der für mich funktioniert:

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

Ich benutze lieber 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 infunktioniert ähnlich forEach, und Sie können die Return-to-Exit-Funktion hinzufügen. Bessere Leistung auch.

Wenn Sie wie in Ihrem Fall basierend auf dem Wert von Elementen, die sich bereits in Ihrem Array befinden, eine Unterbrechung vornehmen müssen (dh wenn die Unterbrechungsbedingung nicht von der Laufzeitvariablen abhängt, die sich ändern kann, nachdem dem Array seine Elementwerte zugewiesen wurden), können Sie auch eine Kombination verwenden von Slice () und IndexOf () wie folgt.

Wenn Sie brechen müssen, wenn forEach 'Apple' erreicht, können Sie verwenden

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
});

Wie in W3Schools.com angegeben, gibt die Slice () -Methode die ausgewählten Elemente in einem Array als neues Array-Objekt zurück. Das ursprüngliche Array wird nicht geändert.

Sehen Sie es in JSFiddle

Hoffe es hilft jemandem.

Sie können eine Variante erstellen von forEachdem ermöglicht break, continue, returnund sogar async/ await: (Beispiel in Typoskript geschrieben)

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];
    }
};

Verwendungszweck:

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);
}

versuchen Sie es mit "find":

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" }

Ja, es ist möglich, fortzufahren und eine forEach-Schleife zu verlassen.

Um fortzufahren, können Sie return verwenden. Die Schleife wird fortgesetzt, aber die aktuelle Funktion wird beendet.

Um die Schleife zu verlassen, können Sie den dritten Parameter auf die Länge 0 und das leere Array setzen. Die Schleife wird nicht fortgesetzt, die aktuelle Funktion jedoch, sodass Sie "return" zum Beenden verwenden können, wie z. B. das Beenden in einer normalen for-Schleife ...

Diese:

[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);
});

wird dies drucken:

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

Vorher ist mein Code unten

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

                    return false;
                }
            });

Ich habe nach unten gewechselt, es wurde behoben.

 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;
                }
            }