suchen

Heim >Web-Frontend >js-Tutorial >Wie schneide ich ein Array in JavaScript ab?

Wie schneide ich ein Array in JavaScript ab?

PHPz
PHPznach vorne
2023-08-30 12:41:02865Durchsuche

如何在 JavaScript 中截断数组？

Dieses Tutorial zeigt Ihnen, wie Sie ein Array in JavaScript abschneiden. Beim Abschneiden eines Arrays werden einige Elemente am Ende entfernt und die neuen Werte des abgeschnittenen Arrays wieder dem tatsächlichen Array zugewiesen.

Manchmal müssen wir ein Array abschneiden. Angenommen, es gibt ein Array mit sortierten (absteigenden) Elementen. Jetzt benötigen wir nur noch die ersten k sortierten Elemente im Array und entfernen den else-Wert. Wir müssen also kein zusätzliches Array erstellen, es ändern und dem tatsächlichen Array zuweisen.

Es gibt viele Möglichkeiten, ein Array zu kürzen. Sehen wir uns alle an.

Grammatik

Das Folgende ist die Syntax zum Abschneiden eines Arrays: 

arr.splice(index, howmany); // the splice() method.
arr.length=idx; // array length property.

Hier arr ist das ursprüngliche Array. idx ist der Index/die Position, an der wir das Array abschneiden möchten. Index ist die Position des zu entfernenden Elements und wie viele Elemente sind aus dem Array zu entfernen.

Algorithmus

  • SCHRITT 1 – Erstellen Sie ein Array arr und fügen Sie Elemente hinzu. Verwenden Sie das innerHTML-Attribut, um arr anzuzeigen.
  • SCHRITT 2 – Wenden Sie die Methode splice() auf das Array arr an und übergeben Sie dabei index und howmany als Argumente. Alternativ können wir arr.length=idx anwenden.
  • Schritt 3 – Zeigen Sie das abgeschnittene Array mit dem innerHTML-Attribut an.

Beispiel 1

Verwenden Sie die Methode Array splice()

Im folgenden Beispiel verwenden wir die Array-Methode splice(), um das Array zu kürzen. Wir definieren ein Array mit sieben Elementen. Wir kürzen Elemente außerhalb von Position 3. 

<html>
<head>
   <title>Example- Truncate an array in JavaScript</title>
</head>
<body>
   <h3>Truncate an Array using splice() Method-</h3>
   <p id="before">Array before truncate:<br></p>
   <p id="after">Array after truncate:<br></p>
   <script>
      let arr = ["kalyan", "ashis", "anand", "sonu", "tirupati", "nagar", "arjun"];
      document.getElementById('before').innerHTML+=arr
      arr.splice(4, arr.length);
      document.getElementById('after').innerHTML+=arr
   </script>
</body>
</html>

Beispiel 2

Array-Längenattribut verwenden

In diesem Beispiel kürzen wir das Array mithilfe der Eigenschaft „Array-Länge“. Wir weisen dem Array einfach die erforderliche Länge zu und seine Größe ändert sich entsprechend der zugewiesenen Größe. 

<html>
<head>
   <title>Example- Truncate an array in JavaScript</title>
</head>
<body>
   <h3>Truncate an Array using Array length property-</h3>
   <p id="before">Array before truncate:<br></p>
   <p id="after">Array after truancate:<br></p>
   <script>
      let arr = ["kalyan", "ashis", "anand", "sonu", "tirupati", "nagar", "arjun"];
      document.getElementById('before').innerHTML+=JSON.stringify(arr)
      arr.length=4
      document.getElementById('after').innerHTML+=JSON.stringify(arr)
   </script>
</body>
</html>

Hier verwenden wir arr.length=4, um das Array auf Größe 4 zu ändern. Es erhält die ersten 4 Elemente und danach werden alle Elemente aus dem Array entfernt.

Es hat einen Nachteil, wir können nur Elemente vom Startindex 0 bis zu einer bestimmten Größe erhalten, im Gegensatz zur Verkettung können wir optional den Startindex und den Endindex definieren.

Jetzt haben Sie vielleicht eine Frage im Kopf. Was passiert, wenn die von uns zugewiesene Größe größer als die Array-Länge ist? Dann erhalten wir nach der Array-Größe ein undefiniertes Array-Element.

Beispiel 3

Im folgenden Beispiel definieren wir ein Array mit der Länge 7 und weisen dann eine Größe zu, die größer als die Array-Länge ist. 

<html>
<body>
   <p id="result1"><p>
   <p id="result2"><p>
   <script>
      let arr = ["kalyan", "ashis", "anand", "sonu", "tirupati", "nagar", "arjun"];
      arr.length=15
      document.getElementById('result1').innerHTML=JSON.stringify(arr);
      document.getElementById('result2').innerHTML=arr[13];
   </script>
</body>
</html>

Hier ändern wir die Array-Größe von 7 auf 15, ohne dem Array Elemente hinzuzufügen. Beachten Sie, dass die Elemente von Index 7 bis 14 leer sind.

Beispiel 4

Verwenden Sie die Array-Slice()-Methode

Im folgenden Beispiel verwenden wir die Array-Slice()-Methode, um das Array zu kürzen. Array Die Methode „slice()“ verändert das ursprüngliche Array nicht, sie gibt nur die Elemente zurück Nach dem angegebenen Argument. Daher müssen wir das zurückgegebene Element in einer Variablen speichern.

Wir definieren ein Array mit sieben Elementen. Wir kürzen Elemente außerhalb von Position 3. 

<html>
<head>
   <title>Example- Truncate an array in JavaScript</title>
</head>
<body>
   <h3>Truncate an Array using slice() Method</h3>
   <p id="before">Array before truncate:<br></p>
   <p id="after">Array after truncate:<br></p>
   <script>
      let arr = ["kalyan", "ashis", "anand", "sonu", "tirupati", "nagar", "arjun"];
      document.getElementById('before').innerHTML+=arr
      arr = arr.slice(0, 4);
      document.getElementById('after').innerHTML+=arr
   </script>
</body>
</html>

Hier ist arr = arr.slice(0, 4); 0 ist der Startindex des Arrays und 4 ist der Endindex, bis wir die Arrays zusammenfügen möchten. Alle Elemente befinden sich vor dem angegebenen Startindex und nach dem Endindex wird vermieden und wir weisen dann das aktualisierte Array dem tatsächlichen Array zu. 

If arr = arr.slice(2, 5); will be there then output will be
Anand, sonu, tirupati
In diesem Tutorial haben wir gelernt, wie man ein Array in JavaScript mithilfe der Array-Methoden splice() und Slice() und der Längeneigenschaft abschneidet.

Das obige ist der detaillierte Inhalt vonWie schneide ich ein Array in JavaScript ab?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：
Dieser Artikel ist reproduziert unter:tutorialspoint.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen
Vorheriger Artikel：Heißes Nachladen in ElectronJsNächster Artikel：Heißes Nachladen in ElectronJs

In Verbindung stehende Artikel

Mehr sehen