Was Sie über JS-Arrays wissen müssen: Array.from

Verwandte Lernempfehlungen: Javascript-Video-Tutorial

Vorwort

Da ich letztes Jahr entdeckte, dass die Ersetzungsmethode von Zeichenfolgen viele magische Verwendungsmöglichkeiten hat, wollte ich diese Serie machen, aber ich Ich hatte nie Zeit, mir einen guten Namen auszudenken, also habe ich ihn auf Eis gelegt. Als ich letzten Freitag meine Hausaufgaben machte, sah ich in den Kommentaren eine Lösung, die darin besteht, Array.from zu verwenden, um das Problem in einer Zeile zu lösen, und es ist ziemlich effizient. Also habe ich mir die Dokumente und Blogs durchgelesen, und nachdem ich es herausgefunden hatte, dachte ich, es sei an der Zeit, mit dieser Serie zu beginnen. Darüber hinaus sind Arrays eine der am häufigsten verwendeten Datenstrukturen in unserer Entwicklung. Als eine der Methoden zur Generierung von Arrays ist es sinnvoll, mit ihnen zu beginnen. Begnügen wir uns einfach mit dem Namen der Serie.

• Grundlegende Syntax

Definition: Die from()-Methode wird verwendet, um ein Array über ein Objekt oder iterierbares Objekt mit der Eigenschaft length zurückzugeben.

Syntax: Array.from(object, mapFunction, thisValue)

Parameter	Beschreibung
object	Erforderlich, das Objekt, das in ein Array konvertiert werden soll.
mapFunction	Optional, die Funktion, die für jedes Element im Array aufgerufen werden soll.
thisValue	Optional, das dieses Objekt in der Mapping-Funktion (mapFunction).

• Beispielverwendung

1. Klassenarray in Array umwandeln

Array.from('hello')                        //["h", "e", "l", "l", "o"]
Array.from(new Set(['name','age']))        //["name", "age"]
Array.from({name:'lgc',age:25})            //[]
let map=new Map()
map.set('name','lgc')
map.set('age',25)
Array.from(map)                            //[["name", "lgc"],["age", 25]]
function test(){
    console.log(Array.from(arguments))
}
test(1,2,3)                                //[1, 2, 3]复制代码

Beim Schreiben dieser Beispiele habe ich mich immer noch gefragt: Warum kann eine Karte in ein Array umgewandelt werden? Und das Objekt kann nur in ein leeres Array konvertiert werden. Als ich mir das Tutorial für Anfänger ansah und die obige Definition sah, verstand ich es. Objekt hat weder eine Länge noch ein iterierbares Objekt. Ich dachte immer, dass Objekt auch ein iterierbares Objekt sei. Aber tatsächlich ist das Objekt von es6 kein iterierbares Objekt. Ich werde hier nicht näher darauf eingehen.

2. Array-Tiefenkopie (eine Codezeile)

function clone(arr){
    return Array.isArray(arr) ? Array.from(arr, clone):arr
}
let arrayA=[[1,2],[3,4]]
let arrayB=clone(arrayA)
arrayA===arrayB                                  //false
arrayA[0]===arrayB[0]                            //false复制代码

Der zweite Parameter „mapFunction“ von Array.from wird hier hauptsächlich verwendet. Standardmäßig übergibt „mapFunction“ zwei Parameter, den Wert und den Index des Arrays.

3. Array-Deduplizierung

function unique(arr){
    return Array.from(new Set(arr))
}复制代码

Dies ist auch die grundlegendste Funktion von from und eine unserer am häufigsten verwendeten Funktionen.

4. Andere Verwendungen von from

Schauen Sie sich noch einmal die Definition von from an: Die from()-Methode wird verwendet, um ein Array über ein Objekt oder iterierbares Objekt mit dem Attribut length zurückzugeben. Nur Länge haben? Probieren Sie es aus

Array.from({length:2},(val,index)=>index)                        //[0,1]复制代码

Okay, aber was nützt es? Erstens können Sie wie im obigen Code problemlos ein Array innerhalb eines bestimmten Bereichs und mit bestimmten Regeln generieren

Array.from({length:3},(val,index)=>index*10)                     //[0,10,20]复制代码

Zweitens die Initialisierung des Arrays. Sie möchten beispielsweise ein Objektarray mit einer bestimmten Länge generieren. Was war die erste Reaktion? füllen?

let testArr=Array(3).fill({})
testArr[0]===testArr[1]                                         //true复制代码

Jedes Objekt hier ist eigentlich das gleiche. Wenn Sie eines ändern, ändern sich natürlich auch die anderen, aber oft ist das, was wir brauchen, nicht so.

let testArrb=Array.from({length:3},()=>({}))
testArrb[0]===testArrb[1]                                       //false复制代码

Diese beiden Methoden können je nach Bedarf eingesetzt werden.

5. Erweiterte Verwendung von from

Der obige Inhalt ist eigentlich schrittweise darauf ausgelegt, die folgenden Problemlösungsideen besser zu verstehen.

LeetCode-Frage 867:

Gegeben sei die transponierte Matrix einer Matrix A， 返回 A.

Die Transponierung einer Matrix bezieht sich auf das Umdrehen der Hauptdiagonalen der Matrix und das Vertauschen des Zeilenindex und des Spaltenindex der Matrix.

Beispiel 1: Eingabe: [[1,2,3],[4,5,6],[7,8,9]] Ausgabe: [[1,4,7],[2,5,8] ,[3,6,9]] Beispiel 2: Eingabe: [[1,2,3],[4,5,6]] Ausgabe: [[1,4],[2,5],[3,6 ]]

Meine erste Reaktion war damals: War das nicht ein Indextausch? Es ist so einfach. Also habe ich den folgenden Code geschrieben

var transpose = function(A) {
    let x=A.length
    let y=A[0].length
    for(let i=0;i<x;i++){
        for(let j=0;j<y;j++){
            if(j-i>0){
                [A[i][j],A[j][i]]=[A[j][i],A[i][j]]
            }
        }
    }
    return A
};复制代码

Ausführungscode: bestanden, Übermittlung: fehlgeschlagen. Verdammt? Als ich mir die Fehlermeldung ansah, stellte ich fest, dass die Situation in Beispiel 2, in der „Länge und Breite“ nicht gleich sind, ignoriert wurde. Ändern Sie Ihr Denken und drehen Sie die internen und externen Zyklen um. Jedes Mal, wenn die äußerste Schleife ausgeführt wird, wird eine Spalte als Zeile behandelt. Ausführen, bestehen.

Aber diese Version sieht zu teuer aus und die Ausführungszeit ist zu langsam. Aber schließlich habe ich es selbst umgesetzt, sodass Sie im Kommentarbereich nach weiteren Ideen suchen können.

Das Folgende wurde von einem Meister im Kommentarbereich implementiert, aber ich habe es beim ersten Mal nicht verstanden.

var transpose = function(A) {    return Array.from({length:A[0].length},(_v,i)=>A.map(v=>v[i]))};复制代码

{length:A[0].length} verwendet die Breite der gegebenen Matrix als Länge der transponierten Matrix, um die Bedingung „ein Objekt mit dem Attribut length“ zu erfüllen. (_v,i)=>A.map(v=>v[i]) verwendet die Spalten der gegebenen Matrix als Zeilen der transponierten Matrix. Die Kernidee ist dieselbe wie in meiner zweiten Version, aber die Implementierungsmethoden und -techniken sind zu umfangreich. Und die Hinrichtungszeit ist auch kürzer, bete den großen Gott an.

Wenn Sie mehr über das Erlernen des Programmierens erfahren möchten, achten Sie bitte auf die Spalte „PHP-Schulung“!

Das obige ist der detaillierte Inhalt vonWas Sie über JS-Arrays wissen müssen: Array.from. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!