13 nützliche JavaScript-Einzeiler

Der Autor des Artikels, dessen Übersetzung wir heute veröffentlichen, sagt, dass er seit vielen Jahren in JavaScript programmiert. Während dieser Zeit sammelte er eine Sammlung exzellenter einzeiliger Dateien - Codefragmente, überraschend leistungsfähig, da sie in eine Zeile passen. Ihm zufolge sind große Chancen auch eine große Verantwortung, daher müssen Sie diese Konstruktionen sorgfältig verwenden, um sicherzustellen, dass sie die Lesbarkeit von Programmen nicht beeinträchtigen.



Hier sind 13 Single-Line-Spieler. Mit Node.js v11.x erstellte Beispiele. Wenn Sie sie in einer anderen Umgebung verwenden, kann dies die Ausführung beeinträchtigen.

1. Zwang von Werten zum logischen Typ


So wandeln Sie einen Wert in einen booleschen Typ um:

const myBoolean = !!myVariable; 

Eine doppelte Negation ( !! ) ist erforderlich, damit ein Wert, der aus Sicht der JavaScript-Regeln true ist, in true und falsch in false konvertiert wird.

2. Entfernen doppelter Werte in Arrays


So entfernen Sie doppelte Werte aus einem Array:

 const deDupe = [...new Set(myArray)]; 

Set Datenstrukturen speichern nur eindeutige Werte. Wenn Sie eine solche Datenstruktur und Spread-Syntax verwenden, können Sie auf der Grundlage von myArray ein neues Array myArray , das keine doppelten Werte enthält.

3. Erstellen und Festlegen von Eigenschaften von Objekten nach Bedingungen


Um Eigenschaften von Objekten mit dem Operator && festzulegen, können Sie die Spread-Syntax verwenden:

 const myObject = { ...myProperty && { propName: myProperty } }; 

Wenn als Ergebnis der Berechnung der linken Seite des Ausdrucks etwas empfangen wird, das JS als falschen Wert wahrnimmt, führt && keine weiteren Berechnungen durch und eine neue Eigenschaft wird nicht erstellt und festgelegt. myObject ist leer. Wenn das Konstrukt ...myProperty ein Ergebnis zurückgibt, das JS dank des Konstrukts && als wahr wahrnimmt, wird die Eigenschaft propName Objekt angezeigt, in dem der empfangene Wert propName ist.

4. Objekte zusammenführen


So erstellen Sie ein neues Objekt, in dem zwei weitere Objekte kombiniert werden:

 const mergedObject = { ...objectOne, ...objectTwo }; 

Dieser Ansatz kann verwendet werden, um die Zusammenführung einer unbegrenzten Anzahl von Objekten zu organisieren. Wenn die Objekte Eigenschaften mit demselben Namen haben, verbleibt außerdem nur eine solche Eigenschaft im endgültigen Objekt, das zu dem der ursprünglichen Objekte gehört, das sich rechts von den anderen befindet. Bitte beachten Sie, dass hier ein kleines Kopieren von Objekteigenschaften verwendet wird.

5. Austausch von Variablenwerten


Um Werte zwischen zwei Variablen auszutauschen, ohne eine Hilfsvariable zu verwenden, haben Sie folgende Möglichkeiten:

 [varA, varB] = [varB, varA]; 

Danach wird das, was in varA in varB und umgekehrt. Dies ist dank der Verwendung interner Destrukturierungsmechanismen möglich.

6. Entfernen falscher Werte aus dem Array


So entfernen Sie alle Werte, die in JavaScript als falsch gelten, aus einem Array:

 const clean = dirty.filter(Boolean); 

Während dieses Vorgangs werden Werte wie null , undefined , false , 0 sowie leere Zeilen aus dem Array gelöscht.

7. Zahlen in Zeichenfolgen konvertieren


Um die im Array gespeicherten Zahlen in ihre Zeichenfolgendarstellung umzuwandeln, haben Sie folgende Möglichkeiten:

 const stringArray = numberArray.map(String); 

Die Zeichenfolgenelemente des Arrays während einer solchen Konvertierung bleiben Zeichenfolge.

Sie können die inverse Transformation auch durchführen, indem Sie Werte vom Typ String in Werte vom Typ Number konvertieren:

 const numberArray = stringArray.map(Number); 

8. Abrufen von Objekteigenschaftswerten


So extrahieren Sie den Wert der Eigenschaft eines Objekts und schreiben ihn in eine Konstante, deren Name sich vom Namen dieser Eigenschaft unterscheidet:

 const { original: newName } = myObject; 

Mit diesem Konstrukt wird eine neue Konstante erstellt, newName , in die der Wert der original Eigenschaft des myObject Objekts geschrieben wird.

9. Formatieren von JSON-Code


So konvertieren Sie den JSON-Code in ein lesbares Erscheinungsbild:

 const formatted = JSON.stringify(myObj, null, 2); 

Die stringify Methode stringify drei Parameter. Das erste ist ein JavaScript-Objekt. Die zweite optionale Funktion kann zum Verarbeiten von JSON-Code verwendet werden, der sich aus der Konvertierung des Objekts ergibt. Der letzte Parameter gibt an, wie viele Leerzeichen beim Einrücken in JSON-Code verwendet werden sollen. Wenn Sie den letzten Parameter weglassen, ist der gesamte empfangene JSON-Code eine lange Zeichenfolge. Wenn das myObj Objekt myObj enthält, kann es nicht in das JSON-Format konvertiert werden.

10. Erstellen Sie schnell numerische Arrays


So erstellen Sie ein Array und füllen es mit Zahlen:

 const numArray = Array.from(new Array(52), (x, i) => i); 

Das erste Element eines solchen Arrays hat einen Index von 0. Die Größe des Arrays kann entweder mit einem numerischen Literal oder einer Variablen angegeben werden. Hier erstellen wir ein Array von 52 Elementen, mit denen beispielsweise Daten zu einem Kartenspiel gespeichert werden können.

11. Erstellung von Codes für die Zwei-Faktor-Authentifizierung


Um den sechsstelligen Code zu generieren, der in Zwei-Faktor-Authentifizierungsmechanismen oder in ähnlichen Mechanismen verwendet wird, können Sie Folgendes tun:

 const code = Math.floor(Math.random() * 1000000).toString().padStart(6, "0"); 

Bitte beachten Sie, dass die Anzahl der Nullen in der Zahl, mit der das von Math.random() zurückgegebene Ergebnis multipliziert werden muss, dem ersten Parameter ( targetLength ) der padStart Methode entsprechen muss.

12. Array mischen


Um ein Array zu mischen, ohne genau zu wissen, was es enthält, können Sie Folgendes tun:

 myArray.sort(() => { return Math.random() - 0.5}); 

Es gibt bessere Algorithmen zum Mischen von Arrays. Zum Beispiel der Fisher-Yates-Mischalgorithmus. Lesen Sie hier mehr über verschiedene Algorithmen zum Mischen von Arrays.

13. Erstellen Sie tiefe Kopien von Objekten


Das hier vorgeschlagene Verfahren zum tiefen Kopieren von Objekten unterscheidet sich nicht in besonders hoher Leistung. Wenn Sie dieses Problem jedoch mit einem Einzeiler lösen müssen, können Sie den folgenden Code verwenden:

 const myClone = JSON.parse(JSON.stringify(originalObject)); 

Es sollte beachtet werden, dass eine Kopie davon fehlschlägt, wenn das originalObject Objekt zirkuläre Links enthält. Diese Technik wird für einfache Objekte empfohlen, die Sie selbst erstellen.

Eine flache Kopie des Objekts kann mithilfe der Spread-Syntax erstellt werden:

 const myClone = { ...orignalObject }; 

Zusammenfassung: zum Kombinieren und Erweitern von einzeiligem Code


Es gibt viele Möglichkeiten, die hier vorgestellten Codefragmente zu kombinieren. Auf diese Weise können Sie viele Probleme mit ihrer Hilfe lösen und gleichzeitig sehr kompakte Sprachkonstrukte verwenden. Der Autor dieses Materials glaubt, dass während der Entwicklung von JavaScript neue Funktionen darin erscheinen werden, die helfen, kompakten und leistungsstarken Code zu schreiben.

Liebe Leser! Welche Beispiele für nützliche JS-Einzeiler würden Sie diesem Material hinzufügen?



Source: https://habr.com/ru/post/de456338/


All Articles