Heim > Web-Frontend > js-Tutorial > Hauptteil

Implementieren Sie ein Array mit gleichen Brüchen in JavaScript

coldplay.xixi
Freigeben: 2020-12-14 17:07:04
nach vorne
3766 Leute haben es durchsucht

In der Spalte

JavaScript wird vorgestellt, wie man Arrays mit gleichen Brüchen implementiert

Implementieren Sie ein Array mit gleichen Brüchen in JavaScript

Verwandte kostenlose Lernempfehlungen: Javascript (Video)

In diesem Tutorial lernen wir, wie man Array.splice() verwendet Die Methode teilt das Array in gleiche Teile. Wir werden auch über die Unterschiede zwischen Array.splice() und Array.slice() sprechen. Array.splice()方法将数组等分,还会讲一下,Array.splice()Array.slice() 它们之间的不同之处。

1. 将数组分为两个相等的部分

我们可以分两步将数组分成两半:

  1. 使用length/2Math.ceil()方法找到数组的中间索引

  2. 使用中间索引和Array.splice()方法获得数组等分的部分

Math.ceil() 函数返回大于或等于一个给定数字的最小整数。

const list = [1, 2, 3, 4, 5, 6];
const middleIndex = Math.ceil(list.length / 2);

const firstHalf = list.splice(0, middleIndex);   
const secondHalf = list.splice(-middleIndex);

console.log(firstHalf);  // [1, 2, 3]
console.log(secondHalf); // [4, 5, 6]
console.log(list);       // []
Nach dem Login kopieren

Array.splice() 方法通过删除,替换或添加元素来更改数组的内容。 而 Array.slice() 方法会先对数组一份拷贝,在操作。

  • list.splice(0, middleIndex) 从数组的0索引处删除前3个元素,并将其返回。
  • splice(-middleIndex)从数组中删除最后3个元素并返回它。

在这两个操作结束时,由于我们已经从数组中删除了所有元素,所以原始数组是空的。

另请注意,在上述情况下,元素数为偶数,如果元素数为奇数,则前一半将有一个额外的元素。

const list = [1, 2, 3, 4, 5];
const middleIndex = Math.ceil(list.length / 2);

list.splice(0, middleIndex); // returns [1, 2, 3]
list.splice(-middleIndex);   // returns [4, 5]
Nach dem Login kopieren

2.Array.slice 和 Array.splice

有时我们并不希望改变原始数组,这个可以配合 Array.slice() 来解决这个问题:

const list = [1, 2, 3, 4, 5, 6];
const middleIndex = Math.ceil(list.length / 2);

const firstHalf = list.slice().splice(0, middleIndex);   
const secondHalf = list.slice().splice(-middleIndex);

console.log(firstHalf);  // [1, 2, 3]
console.log(secondHalf); // [4, 5, 6]
console.log(list);       // [1, 2, 3, 4, 5, 6];
Nach dem Login kopieren

我们看到原始数组保持不变,因为在使用Array.slice()删除元素之前,我们使用Array.slice()复制了原始数组。

3.将数组分成三等分

const list = [1, 2, 3, 4, 5, 6, 7, 8, 9];
const threePartIndex = Math.ceil(list.length / 3);

const thirdPart = list.splice(-threePartIndex);
const secondPart = list.splice(-threePartIndex);
const firstPart = list;     

console.log(firstPart);  // [1, 2, 3]
console.log(secondPart); // [4, 5, 6]
console.log(thirdPart);  // [7, 8, 9]
Nach dem Login kopieren

简单解释一下上面做了啥:

  1. 首先使用st.splice(-threePartIndex)提取了ThirdPart,它删除了最后3个元素[7、8、9],此时list仅包含前6个元素[1、2、3、4、5、6]

  2. 接着,使用list.splice(-threePartIndex)提取了第二部分,它从剩余list = [1、2、3、4、5、6](即[4、5、6])中删除了最后3个元素,list仅包含前三个元素[1、2、3],即firstPart

    1. Teilen Sie das Array in zwei gleiche Teile
Wir können das Array in zwei Schritten aufteilen:

Verwenden Sie length/2 und Math The Die Methode .ceil() findet den mittleren Index des Arrays

  • Verwenden Sie den mittleren Index und die Methode Array.splice(), um die gleichmäßig geteilten Teile des Arrays zu erhalten

    Math. Die Funktion ceil() gibt die kleinste ganze Zahl zurück, die größer oder gleich einer bestimmten Zahl ist. Die Methode

    const list = [1, 2, 3, 4, 5, 6, 7, 8, 9];
    Nach dem Login kopieren

    Array.splice() ändert den Inhalt eines Arrays durch Entfernen, Ersetzen oder Hinzufügen von Elementen. Die Methode Array.slice() erstellt vor der Ausführung zunächst eine Kopie des Arrays.

    • list.splice(0, middleIndex) Löschen Sie die ersten 3 Elemente aus dem 0 Index des Arrays, und gib es zurück.

    • splice(-middleIndex)Entfernt die letzten 3 Elemente aus dem Array und gibt sie zurück.
    Am Ende dieser beiden Vorgänge ist das ursprüngliche Array leer, da wir alle Elemente aus dem Array entfernt haben.

    Beachten Sie außerdem, dass im obigen Fall die Anzahl der Elemente gerade ist. Wenn die Anzahl der Elemente ungerade ist, gibt es in der ersten Hälfte ein zusätzliches Element.

    list.slice().splice(0, 1) // [1]
    Nach dem Login kopieren
    2.Array.slice und Array.splice


    Manchmal möchten wir das ursprüngliche Array nicht ändern. Dies kann mit Array.slice() verwendet werden, um dieses Problem zu lösen:

    list.slice().splice(0, 5) // [1, 2, 3, 4, 5]
    Nach dem Login kopieren
    Wir sehen, dass das ursprüngliche Array bleibt unverändert, da wir vor dem Entfernen von Elementen mit Array.slice() eine Kopie des ursprünglichen Arrays mit Array.slice() erstellen. 3. Teilen Sie das Array in drei gleiche Teile
    list.slice().splice(5) // 6, 7, 8, 9]
    Nach dem Login kopieren
    Erklären Sie kurz, was oben gemacht wird: 🎜
    1. 🎜Verwenden Sie zuerst st.splice(- threePartIndex), um den ThirdPart zu extrahieren. Die letzten 3 Elemente [7, 8, 9] werden gelöscht. Zu diesem Zeitpunkt enthält list nur die ersten 6 Elemente [1, 2, 3,. 4, 5 ,6]. 🎜🎜
    2. 🎜Dann verwenden Sie list.splice(- threePartIndex), um den zweiten Teil zu extrahieren, der aus der verbleibenden list = [1, 2, 3, 4, 5, 6] Die letzten drei Elemente werden aus gelöscht (d. h. [4, 5, 6]), und die Liste enthält nur die ersten drei Elemente [1, 2, 3], d. h. firstPart. 🎜🎜🎜🎜4. Weitere Verwendungsmöglichkeiten von Array.splice()🎜🎜Werfen wir nun einen Blick auf weitere Verwendungsmöglichkeiten von Array.splice(), da ich das ursprüngliche Array nicht ändern möchte. Slice(). Wenn Sie das ursprüngliche Array ändern möchten, können Sie es löschen. 🎜
      list.slice().splice(-1)   // [9]
      Nach dem Login kopieren
      🎜🎜Erstes Element des Arrays abrufen🎜🎜
      list.slice().splice(-3)   // [7, 8, 9]
      Nach dem Login kopieren
      🎜🎜Die ersten 5 Elemente des Arrays abrufen🎜🎜rrreee🎜🎜Alle Elemente nach den ersten 5 Elementen des Arrays abrufen🎜🎜rrreee🎜🎜Das letzte Element abrufen des Arrays🎜 🎜rrreee🎜🎜Erhalten Sie die letzten drei Elemente des Arrays🎜🎜rrreee🎜🎜🎜Die möglichen Fehler nach der Bereitstellung des Codes können nicht in Echtzeit erkannt werden, um diese Fehler anschließend zu beheben Ich möchte es übrigens jedem empfehlen, der sich mit dem Log-Debuggen befasst. Ein nützliches BUG-Überwachungstool. 🎜🎜🎜🎜
  • Das obige ist der detaillierte Inhalt vonImplementieren Sie ein Array mit gleichen Brüchen in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

    Verwandte Etiketten:
    Quelle:csdn.net
    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