Heim  >  Artikel  >  Web-Frontend  >  Erweiterte Schreibmethode für Javascript

Erweiterte Schreibmethode für Javascript

WBOY
WBOYOriginal
2023-05-17 17:19:08847Durchsuche

JavaScript ist eine leistungsstarke Programmiersprache, mit der interaktive Webanwendungen, mobile Anwendungen, Desktop-Anwendungen usw. erstellt werden können. JavaScript ist in einer Vielzahl von Anwendungen zu einem unverzichtbaren Werkzeug geworden. Obwohl die grundlegende Syntax relativ einfach und benutzerfreundlich ist, müssen Sie mit einigen fortgeschrittenen JavaScript-Schreibmethoden und -techniken vertraut sein, wenn Sie hochwertigen JavaScript-Code schreiben möchten. In diesem Artikel werden einige häufig verwendete fortgeschrittene JavaScript-Schreibmethoden vorgestellt.

1. Funktionsausdruck sofort aufrufen (IIFE)

Funktionsausdruck sofort aufrufen (IIFE) ist ein häufig verwendetes und leistungsstarkes JavaScript-Muster. Es ermöglicht uns, einen Codeblock zu schreiben, der den globalen Status nicht beibehält. Interne Variablen in IIFE gelangen nicht in den globalen Namespace und verhindern so eine Verwechslung zwischen Variablen. Die IIFE-Struktur ist wie folgt:

(function() {
// Ihr Code hier
})();

oder:

(function() {
// Ihr Code hier
}());

Die Klammern werden verwendet. Die Funktionsdeklaration wird in einen Funktionsausdruck umgewandelt und am Ende werden Klammern hinzugefügt, um die Funktion sofort auszuführen.

2. Pfeilfunktion

Die Pfeilfunktion ist die Abkürzung einer anonymen Funktion. Es verkürzt Ihren Code und verbessert seine Lesbarkeit. Die Syntax der Pfeilfunktion lautet wie folgt:

(Parameter1, Parameter2, …, ParameterN) => {
// Funktionskörper
}

Oder wenn der Funktionskörper nur eine Anweisung enthält, können Sie die geschweiften Klammern und weglassen Rückgabeschlüsselwort:

(Parameter1, Parameter2, …, ParameterN) => Ausdruck

Die Pfeilfunktion ist eine anonyme Funktion, daher muss eine Variable verwendet werden, um darauf zu verweisen. Hier ist ein Beispiel für eine Pfeilfunktion:

const sum = (a, b) => a + b;

console.log(sum(2, 3)); // Ausgabe: 5

Pfeilfunktionen können Seien Sie schnell. Erstellen Sie neue Daten in einem JavaScript-Array oder filtern oderzuordnen Sie sie:

const zahlen = [1, 2, 3, 4, 5];
const quadratNumbers = zahlen.map(x => x * x
console.log(squaredNumbers); // Ausgabe: [1, 4, 9, 16, 25]

3. Spread-Operator (Spread-Operator) ist eine praktische Syntaxstruktur, die bequem ein Array entpacken kann Objekt in kleinere Komponenten zerlegen. In Arrays ist der Spread-Operator eine praktische Möglichkeit, Elemente aus einem Array in ein anderes Array zu kopieren. In Objekten erleichtert der Spread-Operator das Erstellen neuer Objekte und das Zusammenführen von Eigenschaften.

Das Folgende ist ein Beispiel für den Spread-Operator:

// So verwenden Sie den Spread-Operator in einem Array

const zahlen = [1, 2, 3];

const copyOfNumbers = [...zahlen];

console.log (copyOfNumbers); // Ausgabe: [1, 2, 3]

// Verwendung des Spread-Operators in Objekten

const user = { name: "Tom", age: 25 };

const newUser = { . .user, Stadt: „Peking“ };

console.log(newUser); // Ausgabe: { Name: „Tom“, Alter: 25, Stadt: „Peking“ }

template Vorlagenzeichenfolgen sind ein Syntaxkonstrukt, das die Zeichenfolgeninterpolation einfacher und intuitiver macht. Im Gegensatz zu gewöhnlichen Zeichenfolgen können Vorlagenzeichenfolgen Ausdrücke und Variablen enthalten und werden mithilfe von Backticks ` definiert.

Das Folgende ist ein Beispiel für eine Vorlagenzeichenfolge:

const name = „Tom“;

const age = 25;

console.log(

); // Ausgabe: „Mein Name ist Tom und ich bin 25 Jahre alt "

5. Promise

My name is ${name} and I'm ${age} years oldPromise ist ein integrierter JavaScript-Typ, der für die asynchrone Programmierung verwendet wird. Versprechen bieten eine elegantere und klarere Möglichkeit, asynchrone Vorgänge und Anforderungen zu verarbeiten. Versprechen ermöglichen es Ihnen, das Blockieren des Hauptthreads beim Lesen, Schreiben oder Bearbeiten von Daten zu vermeiden.

Das Folgende ist ein Beispiel für Promise:

// Erstellen Sie eine asynchrone Funktion

const fetchData = () => {

return new Promise((resolve,ject) => {

  // 模拟异步请求
  setTimeout(() => {
     resolve("Data has been fetched successfully!");
  }, 3000);

});
} ;

// Promise verwenden

fetchData()
.then(data => console.log(data))

.catch(error => console.log(error));


Promise ermöglicht die asynchrone Programmierung von JavaScript Code effizienter. Einfach und leicht zu warten.

Fazit

Die oben genannten sind einige gängige fortgeschrittene JavaScript-Schreibmethoden und -techniken, mit denen Sie qualitativ hochwertigen, leicht zu wartenden Code schreiben und die Lesbarkeit und Wiederverwendbarkeit des Codes verbessern können. Natürlich gibt es viele andere fortgeschrittene Schreibmethoden und -techniken, die Sie weiter erlernen und beherrschen müssen, um beim Schreiben von JavaScript-/Node.js-Anwendungen das beste Erlebnis zu erzielen.

Das obige ist der detaillierte Inhalt vonErweiterte Schreibmethode für Javascript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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