Unterschied zwischen zwei Arrays in JavaScript
Wir stellen die Array-Entity-Methode .includes
vor, die verwendet wird, um festzustellen, ob ein Element zu einem Array gehört. Wir werden sie verwenden, um herauszufinden, welche Elemente des ersten Arrays auch im zweiten Array enthalten sind.
Wir werden es in der Funktion condition()
innerhalb der Methode .filter
verwenden. Diese Callback-Funktion kann entweder eine Pfeilfunktion oder eine allgemeine Funktion als Callback-Funktion sein.
Der .filter
kann buchstäblich verwendet werden, um Array-Elemente basierend auf einer Bedingung zu filtern, und die Callback-Funktion bestimmt, welche Elemente der .filter
dem zurückgegebenen Array hinzufügt oder nicht.
Unterschied zwischen zwei Arrays in JavaScript
Das .include
ist eine Methode der Array-Entität. Es gibt true
zurück, wenn das als Parameter übergebene Element in dem Array enthalten ist, in dem die Methode aufgerufen wird, oder false
, wenn das Element nicht enthalten ist. Als einfaches Beispiel:
// Input
let array = ['a', 'b', 'c', 'd'];
console.log(array.includes('a'))
Ausgabe:
// Output
true
Und wenn das Element nicht zum Array gehört, haben wir:
// Input
let array = ['a', 'b', 'c', 'd'];
console.log(array.includes('z'))
Ausgabe:
// Output
false
Diese Methode kann nur zwei Parameter empfangen. Wenn Sie mehr als eines übergeben, kann es einen falschen Wert für die als Parameter übergebene Menge von Elementen zurückgeben. Wie oben zu sehen ist, ist der erste Parameter das Element; der zweite ist der Index oder der fromIndex
, der optional ist.
Der fromIndex
ist der Index, in dem .includes
nach dem Element sucht. Sehen wir uns das Beispiel unten an.
// Input
let array = [1, 2, 3, 4, 5];
console.log(array.includes(3, 3))
Da der Wert 3
auf dem Index array[2]
steht, ist es false
, dass das Array vom Index array[3]
bis zum Ende ein Element gleich 3
hat.
// Output
false
Nun, für die .filter
-Methode ist es auch eine Methode der Array-Entität, und diese Methode gibt ein neues Array zurück, das durch eine Bedingung gefiltert wird, die von der darin enthaltenen condition()
-Funktion bereitgestellt wird. Die Rückgabe eines neuen Arrays bedeutet, dass das ursprüngliche Array, das die Methode aufruft, unveränderlich bleibt.
Auch diese condition()
-Funktion ist eine Callback-Funktion. Eine Rückruffunktion wird als Parameter an eine andere Funktion oder Methode namens äußere Funktion übergeben.
Die äußere Funktion ruft die Callback-Funktion auf, um etwas zu tun; im Fall der .filter
-Methode wird die Bedingungs-Callback-Funktion aufgerufen, um das Array basierend auf dieser Bedingung zu filtern.
Die Methode .filter
ruft die Callback-Funktion für jedes Element im Array auf. Der .filter
hat also eine array.length
Iteration und gibt schließlich ein neues Array mit mehreren Elementen zurück, die der Anzahl der Iterationen entsprechen, bei denen die Callback-Funktion einen Wert zurückgibt, der true
entspricht.
Wenn wir zum Beispiel möchten, dass alle Elemente eine Größe von 3 haben, können wir den .filter
wie unten verwenden.
// Input
let array = ['one', 'two', 'three', 'four', 'five']
array = array.filter(element => element.length == 3)
console.log(array)
In diesem Fall erhält es als Parameter ein Element
, und wenn dieses Element
seine Größe gleich 3 hat, gibt es true
zurück und gibt andernfalls false
zurück. Die Methode .filter
fügt also jedes Element
hinzu, das die Bedingung true
ergibt.
// Output
[ 'one', 'two' ]
Wie erwartet hat die Methode .filter
ein Array basierend auf der Bedingung element.length == 3
zurückgegeben. Jeder Wert des Arrays mit einer Größe von 3 wurde dem zurückgegebenen Array hinzugefügt.
Aber wir möchten den Unterschied zwischen zwei Arrays ermitteln, und dies wird möglich sein, wenn alle zusammengefügt werden.
Verwenden Sie die Methode .filter
für das Array, für das wir den Unterschied erhalten möchten, und darin verwenden wir .include
als Bedingung, um zu überprüfen, ob das Element im Array, das .filter
aufgerufen wird ist im zweiten Element enthalten. Sehen wir uns dieses Beispiel an:
// Input
let array1 = ['a', 'b', 'c', 'd', 'e'];
let array2 = ['a', 'b', 'c'];
console.log(array1.filter(element => array2.includes(element)))
Ausgabe:
// Output
[ 'a', 'b', 'c' ]
Sehen Sie, dass die Ausgabe nicht die Differenz zwischen den beiden Arrays ist, sondern ihre Schnittmenge. Nicht, dass die Bedingung array2.includes(element)
vergleicht, ob das element
im zweiten Array enthalten ist, und wenn es true
ist, fügt der .filter
dieses Element dem resultierenden Array hinzu.
Aber wenn wir ein logisches nicht
oder !
im Zustand? Auf diese Weise fügt der .filter
nur Elemente hinzu, die nicht im zweiten Array enthalten sind. Überprüfen Sie das Beispiel:
// Input
let array1 = ['a', 'b', 'c', 'd', 'e'];
let array2 = ['a', 'b', 'c'];
console.log(array1.filter(element => !array2.includes(element)))
Ausgabe:
// Output
[ 'd', 'e' ]
Schließlich haben wir den Unterschied zwischen den beiden Arrays.
Als Pluspunkt können wir, wenn wir alle Elemente erhalten möchten, die sich nicht in der Schnittmenge befinden, einfach Folgendes tun.
// Input
let array1 = ['a', 'b', 'c', 'd', 'e', 'f'];
let array2 = ['a', 'b', 'c', 'x', 'y', 'z'];
let array3 = array1.filter(element => !array2.includes(element))
.concat(array2.filter(element => !array1.includes(element)))
console.log(array3)
In diesem Beispiel wollen wir alle Elemente, die nicht 'a'
, 'b'
oder 'c'
sind, also ist die Ausgabe:
// Output
[ 'd', 'e', 'f', 'x', 'y', 'z' ]
Und schließlich können wir als letztes unsere Lösung zum Unterschied zwischen zwei Arrays in einer Prototypmethode der Array-Entität hinzufügen. Der .prototype
ist eine Eigenschaft der Array-Entität, die es uns ermöglicht, benutzerdefinierte Eigenschaften und Methoden zu einer Entität hinzuzufügen.
Um eine .difference
-Methode für die Array-Entität zu erstellen, können wir die folgende Struktur verwenden:
// Input
// Declaring the prototype .difference method
Array.prototype.difference = function(array2) {
return this.filter(element => !array2.includes(element))
} let array1 = ['a', 'b', 'c', 'd', 'e'];
console.log(array1.difference(['a', 'b', 'c']))
Ausgabe:
// Output
[ 'd', 'e' ]
Auf diese Weise können wir .difference
jedes Mal verwenden, wenn es notwendig ist, anstatt die Logik jedes Mal neu zu schreiben.
Verwandter Artikel - JavaScript Array
- Überprüfen Sie, ob das Array einen Wert in JavaScript enthält
- Array mit bestimmter Länge in JavaScript erstellen
- Konvertieren ein Array in einen String in JavaScript
- Erstes Element aus einem Array in JavaScript entfernen
- Objekte aus einem Array in JavaScript suchen
- Konvertieren von Argumenten in ein Array in JavaScript