Heim > Web-Frontend > js-Tutorial > Geben Sie einige Tipps zum Schreiben von JavaScript-Code

Geben Sie einige Tipps zum Schreiben von JavaScript-Code

零下一度
Freigeben: 2017-06-17 15:04:12
Original
1375 Leute haben es durchsucht

Vorwort

Aufgrund einiger Veränderungen in der Arbeit und im Leben ist die Häufigkeit des Schreibens von Artikeln in letzter Zeit etwas zurückgegangen. Es tut mir wirklich leid, aber ich glaube, dass es sich bald wieder erholen wird kontinuierliche Aufmerksamkeit und Unterstützung.

In diesem Artikel werden hauptsächlich einige Methoden und Techniken zum Schreiben von JavaScript-Code vorgestellt. Obwohl manchmal alle Wege nach Rom führen, gibt es möglicherweise immer den kürzesten Weg. Ich hoffe, dass jeder Code durch die folgenden JavaScript-Kenntnisse „komplex und vereinfacht sowie vereinfacht und verfeinert“ werden kann.

Lernen und geschickt anwenden

1. new Set()

Einige Leute wissen vielleicht, dass ES6 ein neues Datenstrukturset bereitstellt, aber es gibt möglicherweise nicht viele Leute, die das können nutzen Sie es flexibel. Mit der Set-Datenstruktur können wir ein Array einfach deduplizieren, wie zum Beispiel:

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

2. Object.assign()

Object.assign() ist auch eine Erweiterung der Objekte in ES6 bereitgestellt Methode, die zum Zusammenführen und Kopieren von Objekten verwendet werden kann, wie zum Beispiel:

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

3. map()

Die Map-Methode wird zum Durchlaufen des Arrays verwendet und hat einen Rückgabewert. 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); // 给数组每一项乘以10console.log(newArr3); // [10, 20, 30, 40, 50]
Nach dem Login kopieren

4. filter()

Die Filtermethode wird auch zum Durchlaufen des Arrays verwendet. Wie der Name schon sagt, filtert sie das Array, löst nach jedem Element eine Rückruffunktion aus, behält das Array bei oder entfernt es aktuelles Element durch Beurteilung und gibt schließlich ein neues Array zurück, wie zum Beispiel:

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

5 some()

Die Methode some wird verwendet, um das Array zu durchlaufen und danach eine Rückruffunktion auszulösen Jedes Element. Solange eines die Bedingungen erfüllt, wird „true“ zurückgegeben, andernfalls wird „false“ zurückgegeben, zum Beispiel:

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

6.every()

each Die Methode wird zum Durchlaufen des Arrays verwendet und löst nach jedem Element eine Rückruffunktion aus, solange eines nicht erfüllt ist. Die Bedingung gibt „false“ zurück, andernfalls gibt sie „true“ zurück, ähnlich dem &&-Vergleich, zum Beispiel:

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

7. Das ~~Operator

~-Symbol wird in JavaScript verwendet, um eine bitweise Negation durchzuführen. ~~ bedeutet zweimalige Invertierung, und der Operationswert der Bitoperation muss eine ganze Zahl sein Das Ergebnis ist ebenfalls eine Ganzzahl, sodass die Bitoperation automatisch zu einer Ganzzahl wird und der Dezimalteil geschickt entfernt werden kann, ähnlich wie bei parseInt, zum Beispiel:

let a = 1.23;let b = -1.23;console.log(~~a); // 1console.log(~~b); // -1
Nach dem Login kopieren

8 Operator

Mit dem ||-Operator können wir Standardwerte für Variablen festlegen, zum Beispiel:

let c = 1;let d = c || 2; // 如果c的值为true则取存在的值,否则为2console.log(d); // 1
Nach dem Login kopieren

...Operator

...Operator ist eine Methode Wird zum Zerstören von Arrays in ES6 verwendet und kann zum schnellen Abrufen der Parameter des Arrays verwendet werden, z. B.:

let [num1, ...nums] = [1, 2, 3];console.log(num1); // 1console.log(nums); // [2, 3]
Nach dem Login kopieren

10. Ternäre Operation Operator

Dieser Operator Sollte jedem bekannt sein, kann es das Schreiben von if else vereinfachen, wenn es stillschweigend geschrieben wird, wie zum Beispiel:

let e = true,
    f = '';if (e) {
    f = 'man';
} else {
    f = 'woman';
}// 等同于
f = e ? 'man' : 'woman';
Nach dem Login kopieren

Fazit

In diesem Artikel werden nur 10 gängige Methoden zur Verbesserung der Codierungseffizienz in JavaScript-Syntax und erklärt sie kurz. Natürlich kann jeder Wissenspunkt entsprechend erweitert und erforscht werden. Ich hoffe, dass jeder durch geschicktes Lernen den Effekt erzielen kann.

Das obige ist der detaillierte Inhalt vonGeben Sie einige Tipps zum Schreiben von JavaScript-Code. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage