Heim >Web-Frontend >js-Tutorial >Zusammenfassung der JS-Methoden zum Konvertieren von Nicht-Array-Objekten in Arrays

Zusammenfassung der JS-Methoden zum Konvertieren von Nicht-Array-Objekten in Arrays

亚连
亚连Original
2018-05-28 17:42:481680Durchsuche

Dieser Artikel stellt Ihnen hauptsächlich einige Methoden zum Konvertieren von JS von Nicht-Array-Objekten in Arrays vor, nämlich Array.prototype.slice.call(obj), Array.from(obj), [...obj] und Object. Für detaillierte Implementierungsmethoden von Werten (obj) und anderen Methoden können Freunde in Not darauf verweisen.

Vorwort

Dieser Artikel fasst hauptsächlich einige Methoden zum Konvertieren von JS von Nicht-Array-Objekten in Arrays zusammen und stellt sie als Referenz und zum Studium zur Verfügung . Ich werde im Folgenden nichts sagen, werfen wir einen Blick auf die detaillierte Einführung.

Array.prototype.slice.call(obj)

Diese Methode kann ein Array-ähnliches Objekt in ein Array konvertieren, das so- namens Array-ähnliches Objekt. Es handelt sich um ein Objekt, das Längen- und Indexattribute enthält.

Die Länge des zurückgegebenen Arrays hängt vom Wert des Längenattributs des Objekts und dem Wert des Nicht-Indexattributs ab Der Wert mit einem Index, der größer als die Länge ist, wird nicht an das Array zurückgegeben

Der eigentliche Hammer ist wie folgt

let obj = {
 '0': 3,
 '1': 13,
 '2': 23,
 '3': 33,
 'length': 3,
 'name': 330
}
let arr = Array.prototype.slice.call(obj)
// [3, 13, 23]

Kurze Schreibmethode[].slice.call(obj)

Array.from(obj)

Diese Methode Array-ähnliche Objekte und iterierbare Objekte können in Arrays umgewandelt werden

Array-ähnliche Objekte wurden oben erwähnt sind iterierbare Objekte?

  • Array, Set, Map und String sind alle iterierbare Objekte (WeakMap/WeakSet sind keine iterierbaren Objekte)

  • String-Variable Wurde zu einem iterierbaren Objekt , Lösung des Codierungsproblems

  • Diese Objekte haben Standarditeratoren, das heißt, sie haben das Symbol.iterator-Attribut

  • Sie können das for verwenden der Schleife

  • Alle durch Generatoren erstellten Iteratoren sind iterierbare Objekte

  • document.getElementsByTagName("p") Das zurückgegebene ist ein iterierbares Objekt, aber kein Array
    Array.isArray(document.getElementsByTagName('p')) False zurückgeben

Erstelle ein iterierbares Objekt durch einen Generator

let obj = {
 '0': 3,
 '1': 13,
 '2': 23,
 '3': 33
}

function *createIterator(obj){
 for(let value in obj){
  yield obj[value]
 }
}

let iterator = createIterator(obj)
let arr = Array.from(iterator)
// [3, 13, 23, 33]

Transformiere das Objekt selbst, um es zu einem iterierbaren Objekt zu machen

Standardmäßig ist das Von Entwicklern definierte Objekte sind nicht iterierbare Objekte. Wenn Sie jedoch dem Attribut Symbol.iterator einen Generator hinzufügen, können Sie ihn in ein iterierbares Objekt umwandeln

let obj = {
 '0': 3,
 '1': 13,
 '2': 23,
 '3': 33
}

obj[Symbol.iterator] = function* () {
 for(let value in this){
  yield this[value]
 }
}

let arr = Array.from(obj)
// [3, 13, 23, 33]

Beurteilungsobjekt Ob es sich um eine iterierbare Objektmethode handelt

typeof obj[Symbol.iterator] === 'function'

eine kleine Erweiterung von for of und forEach und for in

for of wird verwendet, um iterierbare Objekte zu schleifen, einschließlich Array, Set, Map, String

Und Array, Set und Alle Karten haben eine forEach-Methode

Darüber hinaus ist NodeList kein Array, Set, Map, sondern ein iterierbares Objekt, das mit for of durchlaufen werden kann

Außerdem kann die Verwendung von for of beendet werden früh durch break beim Schleifen eines Objekts, aber forEach kann die Schleife nicht im Voraus verlassen

for in durchläuft die aufzählbaren Eigenschaften des Objekts, einschließlich der Eigenschaften seiner Prototypenkette, und die Reihenfolge ist nicht garantiert

Um die aufzählbaren Eigenschaften des Objekts selbst zu durchlaufen, verwenden Sie die Methode hasOwnProperty() , um zu bestimmen, ob die Eigenschaft die eigene Eigenschaft des Objekts ist

Object.getOwnPropertyNames(obj) , und geben Sie die eigenen aufzählbaren oder nicht aufzählbaren Eigenschaften des Objekts zurück

Wie auch immer, wir sind zu weit gegangen, also gehen wir noch etwas weiter. Die Methode Object.assign() kopiert die Werte aller aufzählbaren Eigenschaften von einem oder mehreren Quellobjekten zum Zielobjekt

[…obj]

Der Spread-Operator kann ein iterierbares Objekt in ein Array konvertieren

Beispielsweise gibt [...'obj'] ein ["o", "b", "j"]

String-Deduplizierung

[...new Set('objobj')]

Object.values(obj)

Von Vom Entwickler definierte Standardobjekte Es handelt sich bei allen um nicht iterierbare Objekte, die jedoch Methoden zum Zurückgeben von Iteratoren bereitstellen

  • entries()

  • values()

  • keys()

Mit diesen Methoden können Sie das relevante Array zurückgeben

Im Gegensatz zu arrayähnlichen Objekten, die erfordern, dass das Objekt einen Längenwert hat,

Gibt eine Sammlung aufzählbarer Attributwerte des Objekts selbst zurückObject.values(obj)

let obj = {
 '0': 3,
 '1': 13,
 '2': 23,
 '3': 33
}
let arr = Object.values(obj) // [3, 13, 23, 33]

Die Beziehung zwischen Strings und Arrays

Strings können weitgehend als String-Arrays betrachtet werden,

alle haben Längenattribute,

alle haben

/ concat() / indexOf()/ includes() Methoden slice()

Es ist jedoch erwähnenswert, dass es keine Methode zum Ändern des eigenen Inhalts gibt. Sie geben alle eine neue Zeichenfolge zurück.

Es gibt auch eine Methode Dadurch wird eine bestimmte Anzahl von Zeichenfolgenkopien erstellt.

repeat() Das Obige ist das, was ich zusammengestellt habe. Ich hoffe, es wird in Zukunft für alle hilfreich sein.

Verwandte Artikel:

Vorläufiges Verständnis von JavaScript, Ajax, jQuery und Vergleich der Beziehung zwischen den drei

Jquery und PHP kombiniert, um AJAX-Langzeitabfragen zu erreichen

Jquery-spezifische Beispiele zeigen, wann AJAX verwendet werden sollte und wo AJAX verwendet werden sollte

Das obige ist der detaillierte Inhalt vonZusammenfassung der JS-Methoden zum Konvertieren von Nicht-Array-Objekten in Arrays. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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