Heim > Web-Frontend > Front-End-Fragen und Antworten > Zusammenfassung und Weitergabe von 20 JavaScript-Abkürzungstechniken zur Verbesserung der Effizienz

Zusammenfassung und Weitergabe von 20 JavaScript-Abkürzungstechniken zur Verbesserung der Effizienz

WBOY
Freigeben: 2022-01-13 18:11:20
nach vorne
1298 Leute haben es durchsucht

In diesem Artikel werden 20 JavaScript-Abkürzungstechniken zusammengestellt und geteilt, um die Effizienz zu verbessern. Ich hoffe, dass er für alle hilfreich ist.

Zusammenfassung und Weitergabe von 20 JavaScript-Abkürzungstechniken zur Verbesserung der Effizienz

Abkürzungsfähigkeiten

Wenn mehrere Variablen gleichzeitig deklariert werden, können sie in einer Zeile abgekürzt werden

//Longhand
let x;
let y = 20;
 
//Shorthand
let x, y = 20;
Nach dem Login kopieren

Durch Destrukturierung können mehreren Variablen gleichzeitig Werte zugewiesen werden

//Longhand
let a, b, c;
a = 5;
b = 8;
c = 12;
//Shorthand
let [a, b, c] = [5, 8, 12];
Nach dem Login kopieren

Verwenden Sie den ternären Operator zur Vereinfachung.

//Longhand 
let marks = 26; 
let result; 
if (marks >= 30) {
   result = 'Pass'; 
} else { 
   result = 'Fail'; 
} 
//Shorthand 
let result = marks >= 30 ? 'Pass' : 'Fail';
Nach dem Login kopieren

Verwenden Sie den ||-Operator, um einer Variablen einen Standardwert zuzuweisen. Das Wesentliche besteht darin, die Eigenschaften des ||-Operators zu nutzen in einen booleschen Wert von „false“ umgewandelt wird, ist der Wert das Ergebnis des folgenden Ausdrucks

//Longhand
let imagePath;
let path = getImagePath();
if (path !== null && path !== undefined && path !== '') {
    imagePath = path;
} else {
    imagePath = 'default.jpg';
}
//Shorthand
let imagePath = getImagePath() || 'default.jpg';
Nach dem Login kopieren

Verwenden Sie den &&-Operator, um die if-Anweisung zu vereinfachen

Zum Beispiel wird eine Funktion nur aufgerufen, wenn eine bestimmte Bedingung wahr ist, was der Fall sein kann abgekürzt

//Longhand
if (isLoggedin) {
    goToHomepage();
 }
//Shorthand
isLoggedin && goToHomepage();
Nach dem Login kopieren

Verwenden Sie Destrukturierung, um die Werte zweier Variablen auszutauschen

let x = 'Hello', y = 55;
//Longhand
const temp = x;
x = y;
y = temp;
//Shorthand
[x, y] = [y, x];
Nach dem Login kopieren

Wenden Sie Pfeilfunktionen an, um Funktionen zu vereinfachen

//Longhand
function add(num1, num2) {
  return num1 + num2;
}
//Shorthand
const add = (num1, num2) => num1 + num2;
Nach dem Login kopieren

Erforderlich Achten Sie auf den Unterschied zwischen Pfeilfunktionen und gewöhnlichen Funktionen

Verwenden Sie Zeichenfolgenvorlagen, um Code zu vereinfachen

Verwenden Vorlagenzeichenfolgen anstelle der ursprünglichen Zeichenfolgenverkettung

//Longhand
console.log('You got a missed call from ' + number + ' at ' + time);
//Shorthand
console.log(`You got a missed call from ${number} at ${time}`);
Nach dem Login kopieren

Mehrzeilige Zeichenfolgen können auch mithilfe von Zeichenfolgenvorlagen vereinfacht werden

//Longhand
console.log('JavaScript, often abbreviated as JS, is a\n' + 
            'programming language that conforms to the \n' + 
            'ECMAScript specification. JavaScript is high-level,\n' + 
            'often just-in-time compiled, and multi-paradigm.'
            );
//Shorthand
console.log(`JavaScript, often abbreviated as JS, is a
            programming language that conforms to the
            ECMAScript specification. JavaScript is high-level,
            often just-in-time compiled, and multi-paradigm.`
            );
Nach dem Login kopieren

Für den Mehrwertabgleich können alle Werte in einem Array platziert und über die Array-Methode abgekürzt werden

//Longhand
if (value === 1 || value === 'one' || value === 2 || value === 'two') {
  // Execute some code
}
// Shorthand 1
if ([1, 'one', 2, 'two'].indexOf(value) >= 0) {
   // Execute some code
}
// Shorthand 2
if ([1, 'one', 2, 'two'].includes(value)) { 
    // Execute some code 
}
Nach dem Login kopieren

Verwenden die prägnante Syntax von ES6-Objekten

Wenn beispielsweise der Eigenschaftsname und der Variablenname gleich sind, können sie direkt auf eins abgekürzt werden

let firstname = 'Amitav';
let lastname = 'Mishra';
//Longhand
let obj = {firstname: firstname, lastname: lastname};
//Shorthand
let obj = {firstname, lastname};
Nach dem Login kopieren

Verwenden Sie unäre Operatoren, um Zeichenketten in Zahlen zu vereinfachen

//Longhand
let total = parseInt('453');
let average = parseFloat('42.6');
//Shorthand
let total = +'453';
let average = +'42.6';
Nach dem Login kopieren

Verwenden Sie die Methode „repeat()“, um Vereinfachen Sie das Wiederholen einer Zeichenfolge.

//Longhand
let str = '';
for(let i = 0; i < 5; i ++) {
  str += &#39;Hello &#39;;
}
console.log(str); // Hello Hello Hello Hello Hello
// Shorthand
&#39;Hello &#39;.repeat(5);
// 想跟你说100声抱歉!
&#39;sorry\n&#39;.repeat(100);
Nach dem Login kopieren

Verwenden Sie ein doppeltes Sternchen anstelle von Math.pow() als 2147483647

Verwenden Sie den Spread-Operator (...), um den Code zu vereinfachen.

Array-Zusammenführung vereinfachen in und for of, um gewöhnliche for-Schleifen zu vereinfachen Empfehlungen:

Javascript-Lern-Tutorial

Das obige ist der detaillierte Inhalt vonZusammenfassung und Weitergabe von 20 JavaScript-Abkürzungstechniken zur Verbesserung der Effizienz. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:juejin.im
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