Wie sortiert man ein JavaScript-Objekt alphabetisch nach Eigenschaftsnamen?

Sortieren eines JavaScript-Objekts nach erneut besuchtem Eigenschaftsnamen

In JavaScript sind Objekte ungeordnete Sammlungen von Schlüssel-Wert-Paaren. Beim Zugriff auf eine Immobilie über ihren Schlüssel ist die Reihenfolge der Schlüssel unerheblich und nicht garantiert. Es gibt jedoch Szenarien, in denen es wünschenswert ist, ein Objekt nach seinen Eigenschaftsnamen alphabetisch zu sortieren.

Sortiertechniken

Traditionell erforderte das Sortieren eines Objekts nach seinen Eigenschaftsnamen die Konvertierung in ein Array von Schlüsseln, sortiert das Array alphabetisch und rekonstruiert dann das Objekt. Dieser Ansatz nutzte eine Schleife und beinhaltete die Erstellung eines temporären Arrays, was sich auf die Leistung großer Objekte auswirken konnte.

In ES6 wurden Objekte jedoch geordnet. Dies bedeutete, dass die Iteration über die Schlüssel eines Objekts diese in der Reihenfolge zurückgeben würde, in der sie definiert waren. Folglich wurde das Sortieren der Schlüssel eines Objekts so einfach wie:

<code class="javascript">const sortedObject = Object.fromEntries(
  Object.entries(originalObject).sort(([a], [b]) => a.localeCompare(b))
);</code>

In diesem Beispiel konvertiert Object.entries() das Objekt in ein Array von Schlüssel-Wert-Paaren. Dann sortiert sort() das Array alphabetisch basierend auf den Eigenschaftsnamen, wobei localeCompare() für eine Sortierung ohne Berücksichtigung der Groß- und Kleinschreibung verwendet wird. Schließlich rekonstruiert Object.fromEntries() das Objekt mit den sortierten Eigenschaftsnamen.

Hinweis: ES6-Objekte werden nur geordnet, wenn sie mit einem Literal { } erstellt werden oder von einem erben bestelltes Objekt. Mit Object.create(null) erstellte Objekte sind immer noch ungeordnet.

Das obige ist der detaillierte Inhalt vonWie sortiert man ein JavaScript-Objekt alphabetisch nach Eigenschaftsnamen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!