JavaScript-Anleitung Teil 5: Arrays und Loops

Ursprünglicher Autor: Flavio Copes
  • Übersetzung
  • Tutorial
Heute, im fünften Teil der JavaScript-Kursübersetzung, werden wir über Arrays und Schleifen sprechen. Arrays werden verwendet, um viele Probleme zu lösen. Arbeiten Sie häufig mit Arrays, die Schleifen verwenden.

Teil 1: Erstes Programm, Sprachmerkmale, Standards
Teil 2: Codestil und Programmstruktur
Teil 3: Variablen, Datentypen, Ausdrücke, Objekte
Teil 4: Funktionen
Teil 5: Arrays und Schleifen
Teil 6: Ausnahmen, Semikolon, Vorlagenliterale
Teil 7: strikter Modus, dieses Schlüsselwort, Ereignisse, Module, mathematische Berechnungen
Teil 8: Überblick über die ES6-Standardfunktionen
Teil 9: Überblick über die ES7-, ES8- und ES9-Standards



Arrays


Arrays, Objekte des Typs Array, entwickeln sich zusammen mit anderen Mechanismen der Sprache. Sie sind Listen mit nummerierten Werten.

Das erste Element des Arrays hat einen Index (Schlüssel) 0, dieser Ansatz wird in vielen Programmiersprachen verwendet.

In diesem Abschnitt werden moderne Methoden zum Arbeiten mit Arrays behandelt.

▍Arrays initialisieren


Hier sind einige Möglichkeiten zum Initialisieren von Arrays.

const a = []
const a = [1, 2, 3]
const a = Array.of(1, 2, 3)
const a = Array(6).fill(1) //инициализация каждого элемента массива, состоящего из 6 элементов, числом 1

Um auf ein einzelnes Element des Arrays zuzugreifen, verwenden Sie ein Konstrukt aus eckigen Klammern, die den Index des Array-Elements enthalten. Array-Elemente können entweder gelesen oder geschrieben werden.

const a = [1, 2, 3]
console.log(a) //[ 1, 2, 3 ]
const first = a[0]
console.log(first) //1
a[0] = 4
console.log(a) //[ 4, 2, 3 ]

Der Konstruktor Arrayzum Deklarieren von Arrays wird nicht empfohlen.

const a = new Array() //не рекомендуется
const a = new Array(1, 2, 3) //не рекомендуется

Diese Methode sollte nur verwendet werden, wenn typisierte Arrays deklariert werden .

▍Länge des Arrays ermitteln


Um die Länge eines Arrays herauszufinden, müssen Sie auf seine Eigenschaft verweisen length.

const l = a.length

▍Überprüfen eines Arrays mit der Methode every ()


Die Methode der Arrays every()kann verwendet werden, um die Überprüfung aller ihrer Elemente anhand einer bestimmten Bedingung zu organisieren. Wenn alle Elemente des Arrays die Bedingung erfüllen, wird die Funktion zurückgegeben true, andernfalls wird sie zurückgegeben false.

Dieser Methode wird eine Funktion übergeben, die Argumente currentValue(aktuelles Array-Element), index(Index des aktuellen Array-Elements) und array(Array selbst) akzeptiert. Es kann auch einen optionalen Wert annehmen, der als Qualität thisbei der Ausführung der an ihn übergebenen Funktion verwendet wird.
Überprüfen Sie beispielsweise, ob die Werte aller Elemente im Array größer als 10 sind.

const a = [11, 12, 13]
const b = [5, 6, 25]
const test = el => el > 10
console.log(a.every(test)) //true
console.log(b.every(test)) //false

Hier in der Funktion test()interessiert uns nur das erste Argument, das an sie übergeben wurde. Deshalb deklarieren wir es und geben nur den Parameter an, elin den der entsprechende Wert fällt.

▍Überprüfen eines Arrays mit der some () -Methode


Diese Methode ist einer Methode sehr ähnlich every(), gibt jedoch zurück, truewenn mindestens eines der Elemente des Arrays die von der übergebenen Funktion angegebene Bedingung erfüllt.

▍Erstellen Sie mit der map () -Methode ein Array, das auf einem vorhandenen Array basiert


Mit der Methode der Arrays map()können Sie Arrays durchlaufen, wobei Sie für jedes an diese Methode übergebene Element eine Funktion anwenden, die das Element konvertiert, und aus den empfangenen Werten neue Arrays erstellen. Hier sehen Sie beispielsweise, wie Sie ein neues Array erhalten, das das Ergebnis der Multiplikation aller Elemente des ursprünglichen Arrays mit 2 ist.

const a = [1, 2, 3]
const double = el => el * 2
const doubleA = a.map(double)
console.log(a) //[ 1, 2, 3 ]
console.log(doubleA) //[ 2, 4, 6 ]

▍ Ein Array mit der filter () -Methode filtern


Die Methode filter()ähnelt der Methode map(), jedoch können Sie neue Arrays erstellen, die nur die Elemente der ursprünglichen Arrays enthalten, die die von der an die Methode übergebenen filter()Funktion angegebene Bedingung erfüllen .

▍ reduct () Methode


Mit dieser Methode reduce()können Sie die angegebene Funktion auf den Akkumulator und auf jeden Wert des Arrays anwenden und das Array auf einen einzelnen Wert reduzieren (dieser Wert kann entweder einen primitiven oder einen Objekttyp haben). Diese Methode akzeptiert eine Funktion, die die Konvertierung durchführt, und einen optionalen anfänglichen Batteriewert. Betrachten Sie ein Beispiel.

const a = [1, 2, 3, 4].reduce((accumulator, currentValue, currentIndex, array) => {
  return accumulator * currentValue
}, 1)
console.log(a) //24
//итерация 1: 1 * 1 = 1
//итерация 2: 1 * 2 = 2
//итерация 3: 2 * 3 = 6
//итерация 4: 6 * 4 = 24

Hier wird nach dem Produkt aller Elemente des mit dem Literal beschriebenen Arrays gesucht, wobei der Anfangswert des Akkumulators 1 eingestellt wird.

▍ Auflisten eines Arrays mit der forEach () -Methode


Die Methode von Arrays forEach()kann verwendet werden, um die Werte von Arrays zu durchlaufen und bestimmte Aktionen auf ihnen auszuführen, die von der an die Methode übergebenen Funktion angegeben werden. Beispielsweise zeigen wir nacheinander die Elemente des Arrays in der Konsole an.

const a = [1, 2, 3]
a.forEach(el => console.log(el))
//1
//2
//3

Wenn Sie das Iterieren durch eine Anordnung stoppen wollen, oder den Zyklus zu unterbrechen, wenn sie verwendet forEach()werden müssen , um eine Ausnahme werfen. Wenn im Verlauf der Lösung eines bestimmten Problems eine Unterbrechung des Zyklus erforderlich sein sollte, sollten Sie daher eine andere Methode wählen, um die Elemente des Arrays zu durchlaufen.

▍Auswahl eines Arrays mit dem Operator for ... of


Der Operator for...oferschien im ES6-Standard. Sie können iterative Objekte (einschließlich Arrays) durchlaufen. Hier ist, wie man es benutzt.

const a = [1, 2, 3]
for (let v of a) {
  console.log(v)
}
//1
//2
//3

Bei jeder Iteration der Schleife gelangt das vnächste Element des Arrays in die Variable a.

▍ Auflisten eines Arrays mit der for-Anweisung


Mit dem Operator forkönnen Sie Schleifen organisieren, die insbesondere zum Durchlaufen (oder Initialisieren) von Arrays verwendet werden können, indem auf ihre Elemente über den Index zugegriffen wird. Normalerweise wird der Index des nächsten Elements mit einem Schleifenzähler ermittelt.

const a = [1, 2, 3]
for (let i = 0; i < a.length; i += 1) {
  console.log(a[i])
}
//1
//2
//3

Wenn Sie während der Ausführung der Schleife deren Iteration überspringen müssen, können Sie den Befehl verwenden continue. Um den Zyklus vorzeitig zu beenden, können Sie den Befehl verwenden break. Wenn Sie einen Befehl in einer Schleife verwenden, die sich beispielsweise in einer bestimmten Funktion befindet, werden die returnSchleife und die Funktion beendet und der mit der Hilfe zurückgegebene returnWert wird an die Stelle verschoben, an der die Funktion aufgerufen wurde.

▍ Methode @@ Iterator


Diese Methode erschien im ES6-Standard. Es ermöglicht Ihnen, den sogenannten "Iterator eines Objekts" zu erhalten - ein Objekt, mit dem Sie in diesem Fall eine Iteration von Array-Elementen organisieren können. Ein Array-Iterator kann unter Verwendung eines Symbols erhalten werden (solche Symbole werden als "bekannte Symbole" bezeichnet) Symbol.iterator. Nachdem Sie den Iterator erhalten haben, können Sie auf seine Methode zugreifen next(), die bei jedem Aufruf eine Datenstruktur zurückgibt, die das nächste Element des Arrays enthält.

const a = [1, 2, 3]
let it = a[Symbol.iterator]()
console.log(it.next().value) //1
console.log(it.next().value) //2
console.log(it.next().value) //3

Wenn Sie die Methode aufrufen , next()nachdem das letzte Element erreicht wird, kehrt er, als der Wert des Elements undefined. Das von der Methode zurückgegebene Objekt next()enthält die Eigenschaften valueund done. Die Eigenschaft donenimmt den Wert an, falsebis das letzte Element des Arrays erreicht ist. In unserem Fall it.next()wird das Objekt zurückgegeben , wenn es zum vierten Mal aufgerufen wird { value: undefined, done: true }, während dieses Objekt in den vorherigen drei Aufrufen die Form hatte { value: значение, done: false }.

Die Array-Methode entries()gibt einen Iterator zurück, mit dem Sie die Schlüssel-Wert-Paare des Arrays durchlaufen können.

const a = [1, 2, 3]
let it = a.entries()
console.log(it.next().value) //[0, 1]
console.log(it.next().value) //[1, 2]
console.log(it.next().value) //[2, 3]

Mit dieser Methode keys()können Sie die Schlüssel eines Arrays durchlaufen.

const a = [1, 2, 3]
let it = a.keys()
console.log(it.next().value) //0
console.log(it.next().value) //1
console.log(it.next().value) //2

▍Elemente an das Ende eines Arrays anfügen


Verwenden Sie die Methode, um dem Ende eines Arrays Elemente hinzuzufügen push().

a.push(4)

▍Elemente an den Anfang des Arrays anfügen


Verwenden Sie die Methode, um dem Anfang des Arrays Elemente hinzuzufügen unshift().

a.unshift(0)
a.unshift(-2, -1)

▍Array-Elemente entfernen


Sie können ein Element vom Ende des Arrays entfernen, während Sie dieses Element mit der Methode zurückgeben pop().

a.pop()

Auf ähnliche Weise können Sie mit der Methode shift()ein Element am Anfang des Arrays entfernen.

a.shift()

Dasselbe, aber bereits die Position der Entfernung von Elementen und deren Anzahl anzeigend, geschieht mit der Methode splice().

a.splice(0, 2) // удаляет и возвращает 2 элемента из начала массива
a.splice(3, 2) // удаляет и возвращает 2 элемента, начиная с индекса 3

▍Array-Elemente entfernen und stattdessen andere Elemente einfügen


Um mit einer Operation einige Elemente des Arrays zu löschen und stattdessen andere Elemente einzufügen, wird eine Ihnen bekannte Methode verwendet splice().

Zum Beispiel löschen wir hier 3 Elemente des Arrays, beginnend mit Index 2, und fügen danach zwei weitere Elemente an derselben Stelle hinzu:

const a = [1, 2, 3, 4, 5, 6]
a.splice(2, 3, 'a', 'b')
console.log(a) //[ 1, 2, 'a', 'b', 6 ]

▍Kombinieren Sie mehrere Arrays


Um mehrere Arrays zu kombinieren, können Sie die Methode verwenden concat(), die ein neues Array zurückgibt.

const a = [1, 2]
const b = [3, 4]
const c = a.concat(b)
console.log(c) //[ 1, 2, 3, 4 ]

▍Finden Sie Elemente in einem Array


Im ES5-Standard ist eine Methode erschienen indexOf(), die den Index des ersten Auftretens des gewünschten Array-Elements zurückgibt. Wenn das Element im Array nicht gefunden werden kann, wird es zurückgegeben -1.

const a = [1, 2, 3, 4, 5, 6, 7, 5, 8]
console.log(a.indexOf(5)) //4
console.log(a.indexOf(23)) //-1

Das Verfahren lastIndexOf()gibt den Index des letzten Auftretens eines Elements in einem Array, oder , wenn das Element nicht gefunden wird -1.

const a = [1, 2, 3, 4, 5, 6, 7, 5, 8]
console.log(a.lastIndexOf(5)) //7
console.log(a.lastIndexOf(23)) //-1

ES6 führt eine Array-Methode find()ein, die mithilfe der ihr übergebenen Funktion ein Array durchsucht. Wenn die Funktion zurückgibt true, gibt die Methode den Wert des ersten gefundenen Elements zurück. Wenn das Objekt nicht gefunden werden kann, kehrt die Funktion zurück undefined.

Ihre Verwendung kann wie folgt aussehen.

a.find(x => x.id === my_id)

Hier wird in einem Array mit Objekten nach einem Element gesucht, iddessen Eigenschaft der angegebenen entspricht.

Das Verfahren findIndex()ist ähnlich find(), aber es gibt den Index des gefundenen Artikel oder undefined.

Mit ES7 wurde eine Methode eingeführt includes(), mit der Sie das Vorhandensein eines bestimmten Elements in einem Array überprüfen können. Es kehrt trueentweder zurück false, indem es ein für den Programmierer interessantes Element findet oder nicht.

a.includes(value)

Mit dieser Methode kann geprüft werden, ob ein bestimmtes Element vorhanden ist, nicht das gesamte Array, sondern nur ein Teil davon, beginnend mit dem Index, der beim Aufruf dieser Methode angegeben wurde. Der Index wird mit dem zweiten optionalen Parameter dieser Methode angegeben.

a.includes(value, i)

▍Ein Fragment eines Arrays abrufen


Um eine Kopie eines Teils des Arrays als neues Array zu erhalten, können Sie die Methode verwenden slice(). Wenn diese Methode ohne Argumente aufgerufen wird, ist das zurückgegebene Array eine vollständige Kopie des Originals. Es sind zwei optionale Parameter erforderlich. Der erste setzt den Startindex des Fragments, der zweite das Ende. Wenn der Endindex nicht angegeben ist, wird das Array vom angegebenen Startindex zum Ende kopiert.

const a = [1, 2, 3, 4, 5, 6, 7, 8, 9]
console.log(a.slice(4)) //[ 5, 6, 7, 8, 9 ]
console.log(a.slice(3,7)) //[ 4, 5, 6, 7 ]

▍Array sortieren


Um die Sortierung von Array-Elementen in alphabetischer Reihenfolge ( 0-9A-Za-z) zu organisieren, wird eine Methode verwendet, sort()ohne dass Argumente übergeben werden.

const a = [1, 2, 3, 10, 11]
a.sort()
console.log(a) //[ 1, 10, 11, 2, 3 ]
const b = [1, 'a', 'Z', 3, 2, 11]
b.sort()
console.log(b) //[ 1, 11, 2, 3, 'Z', 'a' ]

Sie können dieser Methode eine Funktion übergeben, die die Sortierreihenfolge festlegt. Die Funktion akzeptiert zum Vergleich zweier Elemente die Parameter aund b. Es gibt eine negative Zahl zurück, wenn sie um ein Kriterium akleiner bist, 0, wenn sie gleich sind, und eine positive Zahl, wenn sie agrößer ist b. Wenn eine solche Funktion zu schreiben numerische Arrays für die Sortierung kann es das Ergebnis der Subtraktion erholen aund b. Wenn Sie also das Ergebnis der Auswertung eines Ausdrucks zurückgeben a - b, müssen Sie das Array in aufsteigender Reihenfolge sortieren. Wenn Sie das Ergebnis der Auswertung des Ausdrucks zurückgeben, b - awird das Array in absteigender Reihenfolge sortiert.

const a = [1, 10, 3, 2, 11]
console.log(a.sort((a, b) => a - b)) //[ 1, 2, 3, 10, 11 ]
console.log(a.sort((a, b) => b - a)) //[ 11, 10, 3, 2, 1 ]

Um die Reihenfolge der Elemente im Array umzukehren, können Sie die Methode verwenden reverse(). Es sort()ändert genau wie das Array, für das es aufgerufen wird.

▍Erhalten einer Zeichenfolgendarstellung eines Arrays


Um eine Zeichenfolgendarstellung eines Arrays zu erhalten, können Sie dessen Methode verwenden toString().

a.toString()

Ein ähnliches Ergebnis liefert eine Methode, join()die ohne Argumente aufgerufen wird.

a.join()

Sie können ein Elementtrennzeichen als Argument übergeben.

const a = [1, 10, 3, 2, 11]
console.log(a.toString()) //1,10,3,2,11
console.log(a.join()) //1,10,3,2,11
console.log(a.join(', ')) //1, 10, 3, 2, 11

▍Erstellen von Kopien von Arrays


Mit dieser Methode können Sie eine Kopie des Arrays erstellen, indem Sie die Werte des ursprünglichen Arrays in ein neues Array kopieren Array.from(). Es ist auch zum Erstellen von Arrays aus Array-ähnlichen Objekten (z. B. aus Zeichenfolgen) geeignet.

const a = 'a string'
const b = Array.from(a)
console.log(b) //[ 'a', ' ', 's', 't', 'r', 'i', 'n', 'g' ]

Die Methode Array.of()kann auch verwendet werden, um Arrays zu kopieren oder Arrays aus verschiedenen Elementen zusammenzusetzen. Um beispielsweise die Elemente eines Arrays in ein anderes zu kopieren, können Sie die folgende Konstruktion verwenden.

const a = [1, 10, 3, 2, 11]
const b = Array.of(...a)
console.log(b) // [ 1, 10, 3, 2, 11 ]

Um die Elemente eines Arrays an eine bestimmte Stelle dieses Arrays zu kopieren, wird die Methode verwendet copyWithin(). Das erste Argument gibt den Anfangsindex der Zielposition an, das zweite den Anfangsindex der Position der Elementquelle, und der dritte optionale Parameter gibt den Endindex der Position der Elementquelle an. Wenn Sie es nicht angeben, wird alles an die angegebene Position des Arrays kopiert, beginnend mit dem Anfangsindex der Quellposition bis zum Ende des Arrays.

const a = [1, 2, 3, 4, 5]
a.copyWithin(0, 2)
console.log(a) //[ 3, 4, 5, 4, 5 ]

Zyklen


In Bezug auf die obigen Arrays haben wir bereits einige Möglichkeiten zur Organisation von Loops kennengelernt. Schleifen in JavaScript werden jedoch nicht nur verwendet, um mit Arrays zu arbeiten, und wir haben bei weitem nicht alle Typen berücksichtigt. Aus diesem Grund werden wir uns jetzt mit verschiedenen Methoden zum Organisieren von Schleifen in JavaScript befassen und über deren Funktionen sprechen.

▍ für Schleife


Betrachten Sie ein Beispiel für die Anwendung dieses Zyklus.

const list = ['a', 'b', 'c']
for (let i = 0; i < list.length; i++) {
  console.log(list[i]) //значения, хранящиеся в элементах циклов
  console.log(i) //индексы
}

Wie bereits erwähnt, können Sie die Ausführung einer solchen Schleife mit dem Befehl unterbrechen break, die aktuelle Iteration überspringen und mit dem Befehl direkt zur nächsten übergehen continue.

▍ Für jeden Zyklus


Wir haben diesen Zyklus auch besprochen. Hier ist ein Beispiel für die Iteration über ein Array, das es verwendet.

const list = ['a', 'b', 'c']
list.forEach((item, index) => {
  console.log(item) //значение
  console.log(index) //индекс
})
//если индексы элементов нас не интересуют, можно обойтись и без них
list.forEach(item => console.log(item))

Denken Sie daran, dass zum Unterbrechen eines solchen Zyklus eine Ausnahme ausgelöst werden muss, dh, wenn Sie ihn möglicherweise unterbrechen müssen, wenn Sie einen Zyklus verwenden, ist es besser, einen anderen Zyklus zu wählen.

▍ Do ... while-Schleife


Dies ist der sogenannte „Nachkonditionszyklus“. Ein solcher Zyklus wird mindestens einmal ausgeführt, bevor die Bedingung zum Beenden des Zyklus überprüft wird.

const list = ['a', 'b', 'c']
let i = 0
do {
  console.log(list[i]) //значение
  console.log(i) //индекс
  i = i + 1
} while (i < list.length)

Sie kann mit dem Befehl unterbrochen werden. Mit dem Befehl breakkönnen Sie zur nächsten Iteration übergehen continue.

▍ while-Schleife


Dies ist der sogenannte „vorkonditionierte Zyklus“. Wenn am Eingang des Zyklus die Bedingung zum Fortsetzen des Zyklus falsch ist, wird er nicht einmal ausgeführt.

const list = ['a', 'b', 'c']
let i = 0
while (i < list.length) {
  console.log(list[i]) //значение
  console.log(i) //индекс
  i = i + 1
}

▍ für ... in Schleife


Mit dieser Schleife können Sie alle aufzählbaren Eigenschaften eines Objekts anhand ihrer Namen durchlaufen.

let object = {a: 1, b: 2, c: 'three'}
for (let property in object) {
  console.log(property) //имя свойства
  console.log(object[property]) //значение свойства
}

▍ Zyklus für ... von


Zyklus for...ofkombiniert den Komfort eines Zyklus forEachund die Fähigkeit , seine Arbeit durch regelmäßige Mittel zu unterbrechen.

//перебор значений
for (const value of ['a', 'b', 'c']) {
  console.log(value) //значение
}
//перебор значений и получение индексов с помощью `entries()`
for (const [index, value] of ['a', 'b', 'c'].entries()) {
  console.log(index) //индекс
  console.log(value) //значение
}

Beachten Sie, dass hier, in dem Kopfteilzyklus, das Schlüsselwort const, und nicht, wie man erwarten könnte let. Wenn die Variablen innerhalb des Schleifenblocks nicht neu zugewiesen werden müssen, constpasst das gut zu uns.
Wenn wir die Zyklen for...inund vergleichen for...of, stellt sich heraus, dass for...indie Namen der Eigenschaften und die for...ofWerte der Eigenschaften durchlaufen werden.

Schleifen und Bereiche


Bei Schleifen und beim Gültigkeitsbereich von Variablen gibt es eine JavaScript-Funktion, die dem Entwickler einige Probleme bereiten kann. Um mit diesen Problemen fertig zu werden, sprechen wir über Schleifen, über Gültigkeitsbereiche und über Schlüsselwörter varund let.

Betrachten Sie ein Beispiel.

const operations = []
for (var i = 0; i < 5; i++) {
  operations.push(() => {
    console.log(i)
  })
}
for (const operation of operations) {
  operation()
}

Die Schleife führt 5 Iterationen durch, bei denen dem Array jeweils eine operationsneue Funktion hinzugefügt wird. Diese Funktion zeigt in der Konsole den Wert des Schleifenzählers - an i. Nachdem die Funktionen zum Array hinzugefügt wurden, durchlaufen wir dieses Array und rufen die Funktionen auf, die seine Elemente sind.

Wenn Sie solchen Code ausführen, können Sie das unten gezeigte Ergebnis erwarten.

0
1
2
3
4

Tatsächlich folgert er jedoch Folgendes.

5
5
5
5
5

Warum ist das so? Die Sache ist, dass wir als Schleifenzähler eine Variable verwenden, die mit dem Schlüsselwort deklariert wurde var.

Da die Deklarationen solcher Variablen an die Spitze des Geltungsbereichs rücken, ähnelt der obige Code dem folgenden.

var i;
const operations = []
for (i = 0; i < 5; i++) {
  operations.push(() => {
    console.log(i)
  })
}
for (const operation of operations) {
  operation()
}

Als Ergebnis stellt sich heraus, dass in der Schleife, for...ofin der wir über das Array iterieren, die Variable iimmer noch sichtbar ist, es 5 ist. Infolgedessen geben iwir , bezogen auf alle Funktionen, die Nummer 5 aus.

So ändern Sie das Verhalten des Programms Was wird von ihr erwartet?

Die einfachste Lösung für dieses Problem ist die Verwendung eines Schlüsselworts let. Es ist, wie bereits erwähnt, in ES6 erschienen und ermöglicht es Ihnen, einige der für ES6 charakteristischen Merkwürdigkeiten loszuwerden var.

Insbesondere im obigen Beispiel ist es ausreichend, zu wechseln var, letund alles wird so funktionieren, wie es sollte.

const operations = []
for (let i = 0; i < 5; i++) {
  operations.push(() => {
    console.log(i)
  })
}
for (const operation of operations) {
  operation()
}

Jetzt operationserhält jede zum Array hinzugefügte Funktion bei jeder Iteration der Schleife eine eigene Kopie i. Denken Sie daran, dass Sie in dieser Situation das Schlüsselwort nicht verwenden können const, da sich der Wert iin der Schleife ändert.

Eine andere Möglichkeit, dieses Problem zu lösen, das vor dem ES6-Standard häufig verwendet wurde, wenn das Schlüsselwort letnicht vorhanden war, ist die Verwendung von IIFE.

Bei diesem Ansatz wird der Wert iim Closure gespeichert, und die von IIFE zurückgegebene Funktion, die Zugriff auf den Closure hat, wird in das Array aufgenommen. Diese Funktion kann bei Bedarf ausgeführt werden. So sieht es aus.

const operations = []
for (var i = 0; i < 5; i++) {
  operations.push(((j) => {
    return () => console.log(j)
  })(i))
}
for (const operation of operations) {
  operation()
}

Zusammenfassung


Heute haben wir über Arrays und Loops in JavaScript gesprochen. Das Thema unseres nächsten Artikels sind Ausnahmebehandlung, Semikolon-Verwendungsmuster und Vorlagenliterale.

Sehr geehrte Leser! Welche Methoden zum Arbeiten mit Arrays in JavaScript verwenden Sie am häufigsten?


Jetzt auch beliebt: