Heim > Web-Frontend > js-Tutorial > Hauptteil

Wie schneide ich ein Array in JavaScript ab?

PHPz
Freigeben: 2023-08-30 12:41:02
nach vorne
821 Leute haben es durchsucht

如何在 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.
Nach dem Login kopieren

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>
Nach dem Login kopieren

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> 
Nach dem Login kopieren

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>
Nach dem Login kopieren

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>
Nach dem Login kopieren

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
Nach dem Login kopieren
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!

Quelle:tutorialspoint.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!