Zusammenfassung der grundlegenden Verwendung von JS-Arrays

Zusammenfassung der grundlegenden Verwendung von JS-Arrays

Vorwort

Arrays sind eine spezielle Art von Objekten. In js gibt es kein echtes Array, es werden lediglich Objekte verwendet, um Arrays zu simulieren.

Die gleiche Methode zum Anzeigen von Objekteigenschaften gilt auch für Arrays. Es ist erwähnenswert, dass der Array-Indextyp eine Zeichenfolge und keine Zahl ist.

Der Unterschied zwischen typischen Arrays und JS-Arrays

Typische Array-Funktionen ähnlich denen in C/C++ sind wie folgt:

  • Die Datentypen der Elemente sind gleich
  • Verwenden Sie zusammenhängenden Speicher
  • Elemente durch numerischen Index abrufen

js-Array

  • Die Datentypen der Elemente können unterschiedlich sein
  • Der Speicher ist nicht unbedingt zusammenhängend (Objekte werden zufällig gespeichert)
  • Der Zugriff ist nicht über numerische Indizes möglich, sondern über Zeichenfolgen-Indizes. (Das bedeutet, dass das Array jeden beliebigen Schlüssel haben kann)

Die obige Abbildung veranschaulicht den letzten Punkt: Ein Array kann jeden beliebigen Schlüssel haben. Um zu beweisen, dass der Index eines Arrays eine Zeichenfolge ist, verwenden Sie Object.keys(arr)

Erstellen eines Arrays

Es gibt zwei Möglichkeiten, ein Array zu erstellen:

 sei arr = [1,2,3]
 lass arr = neues Array(1,2,3)

Konvertieren Sie Zeichenfolge in Array split() Array.from()

Es gibt zwei Möglichkeiten, einen String in ein String-Array umzuwandeln.

Pseudo-Array

Ein Array ohne gemeinsame Attribute eines Arrays ist ein Pseudo-Array (es gibt keinen Prototyp eines Arrays in der Prototypenkette eines Pseudo-Arrays).

Es gibt keine Push-, Pop- und anderen Methoden im Pseudo-Array (wie man an console.dir(divList) sehen kann). Wir können es durch Array.from() konvertieren.

Nach der Konvertierung können Sie erfolgreich pushen.

Zwei Arrays zusammenführen

  • concat()

Diese Methode ändert das ursprüngliche Array nicht.

 sei arr1 = [1,2,3]
 sei arr2 = [4,5,6]
 arr1.concat(arr2) // [1,2,3,4,5,6]
 arr1//[1,2,3]
 arr2//[4,5,6]

Abfangen eines Arrays

  • Scheibe()

Diese Methode ändert das ursprüngliche Array nicht.

sei arr = [1,2,3,4,5,6]
arr.slice(3) //[4,5,6]
arr//[1,2,3,4,5,6]

Löschen von Array-Elementen

Löschen des Kopfelements: arr.shift() arr wird geändert und das gelöschte Element wird zurückgegeben

 sei arr = [1,2,3,4,5,6]
 arr.verschiebung() // 1
 arr//[2, 3, 4, 5, 6]

Löschen des Tail-Elements: arr.pop() arr wird geändert und das gelöschte Element wird zurückgegeben

 sei arr = [1,2,3,4,5,6]
 arr.verschiebung() // 6
 arr//[1, 2, 3, 4, 5]

Löschen Sie die Mitte:

arr.splice(index,1) //Lösche das erste Element des Index und gib das gelöschte Element zurück arr.splice(index,1,'x') //Füge 'x' an der gelöschten Position hinzu und gib das gelöschte Element zurück arr.splice(index,1,'x','y') //Füge 'x' und 'y' an der gelöschten Position hinzu und gib das gelöschte Element zurück

 sei arr = [1,2,3,4,5,6,7,8,9]
 //Element 4 löschen
 arr.spleiß(3,1)//4
 arr//[1, 2, 3, 5, 6, 7, 8, 9]
 
 sei arr = [1, 2, 3, 5, 6, 7, 8, 9]
 //Lösche Index 3 und addiere 3,5 und 4
 arr.splice(2,1,3.5,4) // 3
 arr//[1, 2, 3,5, 4, 6, 7, 8, 9]

Array-Elemente anzeigen

Eigenschaften anzeigen

  • Objekt.keys(arr)
  • Objekt.Werte(arr)
sei arr = [1,2,3,4,5]
arr.x='xxx'
Objekt.keys(arr) //["0", "1", "2", "3", "4", "x"]
Objekt.Werte(arr) // [1, 2, 3, 4, 5, "xxx"]

for in Schleife

Elemente anzeigen, die nur Zahlen enthalten

for循環

forEach循環

Überprüfen Sie, ob sich ein Element im Array befindet

arr.indexOf(item) gibt den Array-Index zurück, wenn dieser existiert, andernfalls gibt es -1 zurück.

sei arr = [1,2,3,4,5,6]
arr.indexOf(2) // 1
arr.indexOf(7) // 0

Suchen von Elementen mithilfe von Bedingungen

//Finde das erste gerade Element let arr=[1,2,3,4,5,6]
arr.find(Artikel=>Artikel%2===0)//2

//Finde den ersten geraden Index let arr=[1,2,3,4,5,6]
arr.findIndex(Artikel=>Artikel%2===0)//1

Hinzufügen von Elementen zu einem Array

Am Ende hinzufügen: arr.push(item1,item2)

 sei arr = [3,4,5,6]
 arr.drücken(7,8,9)
 arr//[3,4,5,6,7,8,9]

Header-Ergänzung: arr.unshift(item1,item2)

 sei arr = [3,4,5,6]
 arr.unshift(1,2,3)
 arr//[1, 2, 3, 3, 4, 5, 6]

In der Mitte hinzufügen: arr.splice(index,0,'x')

 sei arr = [1,2,3,4,5,6,7]
 //Addiere 3.33,3.44 zur Position mit Index 2
 arr.splice(2,0,3.33,3.44) // [1, 2, 3.33, 3.44, 3, 4, 5, 6, 7]

Zusammenfassen

Damit ist dieser Artikel über die grundlegende Verwendungsübersicht von JS-Arrays abgeschlossen. Weitere relevante Inhalte zur Verwendung von JS-Arrays finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird!

Das könnte Sie auch interessieren:
  • Häufig verwendete JavaScript-Array-Methoden
  • Detaillierte Zusammenfassung des JavaScript-Arrays
  • Tiefgreifendes Verständnis des Javascript-Klassenarrays
  • Zusammenfassung der JavaScript-Array-Vereinfachungstechniken
  • Eine kurze Einführung in JavaScript-Arrays

<<:  Grafisches Tutorial zur Installation und Konfiguration von MySQL 5.7.17 winx64

>>:  So konfigurieren Sie MySQL auf einem Ubuntu 16.04-Server und aktivieren die Remote-Verbindung

Artikel empfehlen

Erläuterung der Zusammenführung von TypeScript-Namespaces

Inhaltsverzeichnis Namespaces mit gleichem Namen ...

Implementierungsbeispiel eines Nginx+Tomcat-Load-Balancing-Clusters

Inhaltsverzeichnis Einführung 1. Fallübersicht 2....

Ein Artikel, der Ihnen ein tiefes Verständnis von Mysql-Triggern vermittelt

Inhaltsverzeichnis 1. Wenn beim Einfügen oder Änd...

So begrenzen Sie den Wertebereich von Objektschlüsseln in TypeScript

Wenn wir TypeScript verwenden, möchten wir das vo...

Implementierung eines Docker-Cross-Host-Netzwerks (manuell)

1. Einführung in Macvlan Vor dem Aufkommen von Ma...

Frage zur Webseitenerstellung: Bilddateipfad

Dieser Artikel stammt ursprünglich von 123WORDPRE...

Tiefes Verständnis der Verwendung von ::before/:before und ::after/:after

Teil 1: Grundlagen 1. Im Gegensatz zu Pseudoklass...

Tutorial zur HTML-Tabellenauszeichnung (48): CSS-modifizierte Tabelle

<br />Sehen wir uns nun an, wie Sie die CSS-...

Analyse von Context-Anwendungsszenarien in React

Kontextdefinition und Zweck Der Kontext bietet ei...

Implementierung der CSS-Transformation des Seitenumblätter-Animationsdatensatzes

Szenario mit dem Problem des Seitenumblätterns B ...

Detaillierte Erklärung der Stammverzeichniseinstellungen in nginx.conf

Bei der Konfiguration von nginx.conf treten immer...

Vue implementiert die Drag & Drop-Sortierfunktion der Seiten-Div-Box

vue implementiert die Drag & Drop-Sortierfunk...