Wie erhält man das erste Element eines Arrays?

Question

Wie erhält man das erste Element aus einem Array wie diesem:

var ary = ['first', 'second', 'third', 'fourth', 'fifth'];

Ich habe dies versucht:

alert($(ary).first());

Aber sie würde zurückkehren [object Object] . Ich muss also das erste Element aus dem Array holen, das das Element 'first' .

Answer 1

Wie diese

alert(ary[0])

Answer 2

Warum werden Sie jQuery-ifying ein Vanilla JavaScript-Array? Verwenden Sie Standard-JavaScript!

var ary = ['first', 'second', 'third', 'fourth', 'fifth'];
alert(ary[0]);

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array

Auch,

Quelle mit freundlicher Genehmigung von bobince

Answer 3

Nachstehend finden Sie einige Möglichkeiten für verschiedene Situationen.

In den meisten normalen Fällen ist der einfachste Weg, auf das erste Element zuzugreifen, durch

yourArray[0]

aber dazu müssen Sie prüfen, ob [0] tatsächlich existiert.

Eine weitere häufig verwendete Methode ist shift() aber Sie sollten dies nicht für den Zugriff auf das erste Element verwenden.

Nun, diese Methode verändert das ursprüngliche Array (entfernt das erste Element und gibt es zurück), indiziert aber das, was im Array übrig ist, neu, so dass es bei 0 beginnt (verschiebt alles nach unten). Daher wird die Länge eines Arrays um eins verringert. Es gibt gute Fälle, in denen Sie dies benötigen, z. B. um den ersten Kunden in der Warteschlange zu erfassen, aber es ist sehr ineffizient, dies für den Zweck des Zugriffs auf das erste Element zu verwenden.

Darüber hinaus erfordert dies ein perfektes Array mit intaktem [0]-Indexzeiger, genau wie bei der Verwendung von [0];

yourArray.shift()

Es ist wichtig zu wissen, dass die beiden oben genannten Optionen nur dann in Frage kommen, wenn Ihr Array mit einem [0]-Index beginnt.

Es gibt Fälle, in denen das erste Element gelöscht wurde, z.B. mit delete yourArray[0], wodurch das Array "Löcher" hat. Jetzt ist das Element bei [0] einfach undefiniert, aber Sie wollen das erste "vorhandene" Element erhalten. Ich habe viele Fälle dieser Art in der realen Welt gesehen.

Angenommen, wir kennen das Array und den ersten Schlüssel nicht (oder wir wissen, dass es Löcher gibt), so können wir dennoch das erste Element ermitteln.

Sie können verwenden finden() um das erste Element zu erhalten.

Der Vorteil von find() ist seine Effizienz, da es die Schleife verlässt, wenn der erste Wert, der die Bedingung erfüllt, erreicht ist (mehr dazu weiter unten). (Sie können die Bedingung auch so anpassen, dass Null oder andere leere Werte ausgeschlossen werden)

var firstItem = yourArray.find(x=>x!==undefined);

Ich möchte auch Folgendes einbeziehen filter() hier als Option, um zuerst das Array in der Kopie zu "fixieren" und dann das erste Element zu erhalten, während das ursprüngliche Array intakt (unverändert) bleibt.

Ein weiterer Grund, filter() hier einzubeziehen, ist, dass es vor find() existierte und viele Programmierer es bereits verwendet haben (es ist ES5, während find() ES6 ist).

var firstItem = yourArray.filter(x => typeof x!==undefined).shift();

Achtung: filter() ist nicht wirklich effizient (filter() durchläuft alle Elemente) und erzeugt ein weiteres Array. Es ist in Ordnung, auf kleine Arrays zu verwenden, da die Auswirkungen auf die Leistung marginal sind, näher an der Verwendung von forEach, zum Beispiel.

Ein weiteres Beispiel, das ich in einigen Projekten gesehen habe, ist splice() um das erste Element in einem Array zu erhalten und es dann nach Index abzurufen:

var firstItem = yourArray.splice(0, 1)[0];

Ich bin mir nicht sicher, warum Sie das tun sollten. Diese Methode löst nicht das Problem mit Löchern im Array (sparse array). Sie ist kostspielig, da sie das Array neu indiziert und ein Array zurückgibt, auf das Sie erneut zugreifen müssen, um den Wert zu erhalten. Wenn Sie z.B. die ersten paar Elemente löschen und splice gibt statt des ersten definierten Wertes aus dem Array einen undefinierten Wert zurück.

(Ich sehe, dass einige Leute vorschlagen, for...in-Schleifen zu verwenden, um das erste Element zu erhalten, aber ich würde diese Methode nicht empfehlen for...in sollte nicht verwendet werden, um über ein Array zu iterieren, bei dem die Reihenfolge der Indizes wichtig ist weil es die Reihenfolge nicht garantiert, obwohl man argumentieren kann, dass Browser meist die Reihenfolge respektieren. forEach löst das Problem übrigens nicht, wie viele vorschlagen, weil man es nicht unterbrechen kann und es durch alle Elemente läuft. Sie wären besser dran, wenn Sie eine einfache for-Schleife verwenden und Schlüssel/Wert überprüfen würden.

Sowohl find() als auch filter() garantieren die Reihenfolge der Elemente, so dass sie wie oben beschrieben sicher verwendet werden können.

Answer 4

ES6-Destrukturierung verwenden

let [first] = [1,2,3];

Das ist dasselbe wie

let first = [1,2,3][0];

Answer 5

Sie können einfach Folgendes verwenden find() :

const first = array.find(Boolean)

Oder wenn Sie das erste Element sogar wenn es sich falsy :

const first = array.find(() => true)

Oder wenn Sie das erste Element sogar wenn es sich falsy aber nicht, wenn sie null oder undefiniert ist ( mehr Informationen ):

const first = array.find(e => typeof e !== 'undefined')

---

Die Extrameile gehen:

Wenn Ihnen die Lesbarkeit wichtig ist, Sie sich aber nicht auf numerische Häufigkeiten verlassen wollen, können Sie eine first() -Funktion zu Array.prototype durch Definition mit Object.defineProperty() die die Fallstricke der direkten Änderung des eingebauten Array-Objektprototyps abmildert ( hier erklärt ).

Die Leistung ist ziemlich gut ( find() hört nach dem ersten Element auf), aber es ist nicht perfekt oder allgemein zugänglich (nur ES6). Für mehr Hintergrund lesen Sie @Selays Antwort .

Object.defineProperty(Array.prototype, 'first', {
  value() {
    return this.find(e => true)     // or this.find(Boolean)
  }
})

Um das erste Element abzurufen, können Sie nun wie folgt vorgehen:

const array = ['a', 'b', 'c']
array.first()

> 'a'

Snippet, um es in Aktion zu sehen:

Object.defineProperty(Array.prototype, 'first', {
  value() {
    return this.find(Boolean)
  }
})

console.log( ['a', 'b', 'c'].first() )