Ich musste kürzlich das erste Element aus einem Array in JavaScript abrufen. Hmmm... lass mich mal überlegen. Ich erinnere mich, dass .pop() dazu dient, das letzte Element aus dem Array zu holen, so hier
const arr = ["This", "Little", "Piggy"];
const first = arr.pop();
console.log(first);
// "Piggy"Was ist also das Gegenteil von .pop()? (Bitte kurz pausieren für eine kleine Web-Suche...) Aha! Es ist .shift()!
const arr = ["This", "Little", "Piggy"];
const first = arr.shift();
console.log(first);
// "This"(Beachten Sie, dass arr[0] wahrscheinlich der einfachste Weg ist, das erste Element zu erhalten, aber spielen Sie hier mit. Außerdem ist es manchmal ganz nett, wenn das, was aus dem Array geschnitten wird, ein Array bleibt, also suchen wir weiter...)
Aber als ich nach dieser wunderbaren kleinen Hilfsmethode griff, blieb ich wie angewurzelt stehen! Nicht jeder wird auf dieses Problem stoßen, da es sich nicht um ein Problem mit Arrays im Allgemeinen handelt, sondern mit Arrays in bestimmten Kontexten. Dies sah ich im Code, an dem ich arbeitete
Das Problem war, dass ich dieses Element aus einem Array ziehen wollte, das ich nicht manipulieren durfte. In meinem Fall verwendete ich Apollo GraphQL und die Daten, die ich zurückbekam, waren in Form einer schreibgeschützten Eigenschaft.
Schreibgeschützt? Ich will hier doch nur das erste Element eines Arrays abfragen: Ich ändere doch nichts. ODER DOCH? (Ja, das tue ich.) Es stellt sich heraus, dass sowohl .pop() als auch .shift() diese letzten bzw. ersten Elemente zurückgeben, aber sie manipulieren auch das Originalarray. Und mein Array war unmanipulierbar.
Was ich eigentlich brauchte, war, ein Array zu nehmen und sowohl das erste Element als auch alle übrigen Elemente in einem neuen Array zu erhalten, während das Originalarray unangetastet bleibt! Die .slice() Array-Methode half mir hier gut weiter. Sie vergreift sich nicht am Originalarray.
Das wird uns gute Dienste leisten
const arr = ["This", "Little", "Piggy"];
const first = arr.slice(0, 1);
const the_rest = arr.slice(1);console.log(first); // ["This"]
console.log(the_rest); // ["Little", "Piggy"]Hey, genau das brauchte ich!
Brauchen Sie eine einfache Möglichkeit, die richtige Array-Methode zu finden, die Sie benötigen? Probieren Sie Sarah Drasners JavaScript Array Explorer