ES6/JavaScript-Nutzungsfähigkeiten, Sharing_Javascript-Kenntnisse

In diesem Artikel werden hauptsächlich Tipps zur Verwendung von ES6/JavaScript erläutert. Freunde, die sich für JavaScript interessieren, oder Studenten, die noch JavaScript lernen, sollten sich darauf beziehen.

Es gibt einige Methoden und Techniken beim Schreiben von JavaScript-Code. Obwohl manchmal alle Wege nach Rom führen, kann es sein, dass es immer den kürzesten Weg gibt. In diesem Artikel erfahren Sie einige Tipps, die jeder kennt, aber nicht sehr oft verwenden

Einige Tipps

1.new Set()

Um Arrays zu deduplizieren, habe ich in meinem „Unterbewusstsein“ das Gefühl, dass wir eine Schleife durchführen und mit der Deduplizierung vergleichen sollten. Tatsächlich bietet ES6 einen neuen Datenstruktursatz, der einfach verwendet werden kann deduplizieren. Array, wie zum Beispiel:

let arr = [1,1, 2, 2, 3, 3];
let set = new Set(arr); //
let newArr = Array.from(set); // Array.from方法可以将 Set 结构转为数组。 
console.log(newArr); // [1, 2, 3]

2.Object.assign()

ist auch eine in ES6 bereitgestellte Erweiterungsmethode, mit der Objekte zusammengeführt und kopiert werden können. Früher war das Zusammenführen von Objekten ebenfalls sehr umständlich, aber jetzt ist es sehr einfach, z :

let obj1 = {a: 1};
let obj2 = {b: 2};
let obj3 = Object.assign({}, obj1, obj2);
console.log(obj3); // {a: 1, b: 2}

3.map()

map-Methode wird beim Durchlaufen des Arrays verwendet. Sie können jedes Element des Arrays bearbeiten und ein neues Array generieren. Manchmal kann es die for- und forEach-Schleifen ersetzen um den Code zu vereinfachen, wie zum Beispiel:

let arr3 = [1, 2, 3, 4, 5];
let newArr3 = arr3.map((e, i) => e * 10); // 给数组每一项乘以10
console.log(newArr3); // [10, 20, 30, 40, 50]

4.filter()

Die Filtermethode wird auch zum Durchlaufen eines Arrays verwendet. Wie der Name schon sagt, dient sie dazu, das Array zu filtern, nach jedem Element eine Rückruffunktion auszulösen und das aktuelle Element beizubehalten oder zu entfernen Urteil und geben Sie schließlich ein neues Array zurück, z. B.:

let arr4 = [1, 2, 3, 4, 5];
let newArr4 = arr4.filter((e, i) => e % 2 === 0); // 取模，过滤余数不为0的数
console.log(newArr4); // [2，4]

5.some()

Eine Methode wird verwendet, um das Array zu durchlaufen und nach jedem Element eine Rückruffunktion auszulösen gibt „true“ zurück, andernfalls wird „false“ zurückgegeben, ähnlich wie bei || 🎜>6.every() //Das Gegenteil von 5

Die Methode

let arr5 = [{result: true}, {result: false}];
let newArr5 = arr5.some((e, i) => e.result); // 只要一个为true，即为true
console.log(newArr5); // true

every wird verwendet, um das Array zu durchlaufen und nach jedem Element eine Rückruffunktion auszulösen Wenn das Element die Bedingung nicht erfüllt, gibt es false zurück, andernfalls gibt es true zurück, ähnlich dem &&-Vergleich, wie zum Beispiel:

7.

Ternäre Operation

Symbol

let arr6 = [{result: true}, {result: false}];
let newArr6 = arr6.every((e, i) => e.result); // 只要一个为false，即为false
console.log(newArr6); // false

Dieser Operator sollte jedem bekannt sein. Er kann das vereinfachen Schreiben, wenn sonst still geschrieben, wie zum Beispiel:

8.~~Operator

let e = true,
f = '';
if (e) {
f = 'aaa';
} else {
f = 'bbb';
}
// 等同于
f = e ? 'aaa' : 'bbb';

Das in JavaScript verwendete ~-Symbol hat eine bitweise Negation. Die Funktion von ~~ besteht darin, zweimal zu invertieren, und der Operationswert der Bitoperation ist erforderlich um eine Ganzzahl zu sein, und das Ergebnis ist auch eine Ganzzahl, sodass die Bitoperation automatisch zu einer Ganzzahl wird und der Dezimalteil geschickt entfernt werden kann, ähnlich wie bei parseInt, z. B.:

Fazit

let a = 1.23;
let b = -1.23;
console.log(~~a); // 1
console.log(~~b); // -1

In diesem Artikel werden nur einige der häufigsten aufgeführt Methoden in der
JavaScript-Syntax

, die die Geschwindigkeit verbessern können. Ich hoffe, dass jeder den Effekt einer geschickten Nutzung von Wissen im Prozess des geschickten Lernens erzielen kann.

Verwandte Empfehlungen:

Eine kurze Diskussion über die Kartendatenstruktur von es6 Javascript_Javascript-Fähigkeiten

Detaillierte Erläuterung, wie man ES6 zur Implementierung des Singleton-Musters und seiner Anwendung verwendet

Detaillierte Erläuterung der Modulsyntax in JavaScript ES6

Das obige ist der detaillierte Inhalt vonES6/JavaScript-Nutzungsfähigkeiten, Sharing_Javascript-Kenntnisse. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!