Fähigkeiten modern-javascript-patterns
📦

modern-javascript-patterns

Sicher

Moderne JavaScript-Patterns anwenden

Legacy-JavaScript-Codebasen sind schwer zu warten und zu optimieren. Diese Fähigkeit bietet umfassende Anleitung zu ES6+-Features, einschließlich Arrow-Funktionen, Destructuring, async/await, Promises, funktionaler Programmier-Patterns und moderner Klassen-Features, um sauberen, effizienten und wartbaren JavaScript-Code zu schreiben.

Unterstützt: Claude Codex Code(CC)
📊 69 Angemessen
1

Die Skill-ZIP herunterladen

2

In Claude hochladen

Gehe zu Einstellungen → Fähigkeiten → Skills → Skill hochladen

3

Einschalten und loslegen

Teste es

Verwendung von "modern-javascript-patterns". How do I destructure nested objects in JavaScript?

Erwartetes Ergebnis:

Verschachteltes Objekt-Destructuring ermöglicht es dir, Werte aus tief verschachtelten Objekten zu extrahieren:

```javascript
const user = {
id: 1,
name: 'Alice',
address: {
city: 'Boston',
country: 'USA'
}
};

// Verschachteltes Destructuring
const {
name,
address: { city, country }
} = user;

console.log(city); // 'Boston'
console.log(country); // 'USA'

// Mit Standardwerten
const {
address: {
city = 'Unknown',
zipCode = '00000'
} = {}
} = user;
```

Verwendung von "modern-javascript-patterns". What's the difference between Promise.all and Promise.allSettled?

Erwartetes Ergebnis:

Promise.all scheitert schnell - wenn irgendein Promise verworfen wird, schlägt die gesamte Operation fehl. Promise.allSettled wartet auf alle Promises, unabhängig vom Ergebnis:

```javascript
// Promise.all - scheitert bei erster Ablehnung
const users = await Promise.all([
fetchUser(1),
fetchUser(2)
]); // Wirft einen Fehler, wenn einer fehlschlägt

// Promise.allSettled - wartet auf alle
const results = await Promise.allSettled([
fetchUser(1),
fetchUser(2)
]);

results.forEach(result => {
if (result.status === 'fulfilled') {
console.log('Erfolg:', result.value);
} else {
console.log('Fehlgeschlagen:', result.reason);
}
});
```

Sicherheitsaudit

Sicher
v5 • 1/21/2026

This is a documentation skill containing educational content about JavaScript ES6+ patterns. All static analysis findings are false positives. The 'weak cryptographic algorithm' flags are triggered by JavaScript template literals and class private field syntax (#). The 'shell backtick execution' flags are false positives from JavaScript template literals in code examples. The 'dynamic import()' detections are legitimate ES6 module examples being documented. No malicious code patterns exist.

2
Gescannte Dateien
1,897
Analysierte Zeilen
0
befunde
5
Gesamtzahl Audits
Keine Sicherheitsprobleme gefunden
Auditiert von: claude Audit-Verlauf anzeigen →

Qualitätsbewertung

38
Architektur
100
Wartbarkeit
87
Inhalt
21
Community
100
Sicherheit
83
Spezifikationskonformität

Was du bauen kannst

Legacy-JavaScript-Codebasen refaktorieren

Migriere Callback-basierten Code zu Promises und async/await-Patterns. Ersetze traditionelle Funktionen durch Arrow-Funktionen, um 'this'-Binding-Probleme zu beheben. Wende Destructuring und Spread-Operatoren an, um Datenmanipulation zu vereinfachen.

Funktionale Programmierung in JavaScript lernen

Verstehe, wie du map, filter und reduce für Datentransformation verwendest. Lerne, reine Funktionen zu erstellen, die Seiteneffekte vermeiden. Wende Funktionskomposition und Piping für lesbare Datenverarbeitungs-Pipelines an.

Wartbaren JavaScript-Code schreiben

Wende moderne JavaScript-Patterns für saubereren, ausdrucksstärkeren Code an. Verwende proper Modulorganisation und ES6-Klassen-Features. Implementiere Performance-Optimierungen wie Debouncing, Throttling und Lazy-Evaluation.

Probiere diese Prompts

Grundlegende ES6+-Frage
Wie verwende ich [feature] in modernem JavaScript? Kannst du mir Beispiele für [use case] zeigen?
Legacy-Code refaktorieren
Ich habe diesen Legacy-JavaScript-Code: [code snippet]. Wie kann ich ihn auf moderne ES6+-Patterns refaktorieren? Welche spezifischen Features sollte ich anwenden?
Async-Pattern-Implementierung
Ich muss [specific async task] implementieren. Sollte ich Promises, async/await oder eine Kombination verwenden? Zeig mir das Best-Practice-Pattern für [scenario] mit proper Fehlerbehandlung.
Funktionale Programmier-Herausforderung
Ich habe ein Array von Objekten: [data structure]. Wie kann ich funktionale Programmierung verwenden, um diese Daten zu [transform/group/filter/aggregate]? Zeig mir Schritt für Schritt, wie ich Funktionen für diese Aufgabe komponiere.

Bewährte Verfahren

  • Verwende standardmäßig const und nur let, wenn eine Neuzuweisung wirklich notwendig ist. Dies verhindert unbeabsichtigte Mutationen und macht die Codeabsicht klarer.
  • Bevorzuge Arrow-Funktionen für Callbacks und Methoden, die lexikalisches 'this'-Binding benötigen. Verwende traditionelle Funktionen nur, wenn du dynamisches 'this' benötigst.
  • Wende Destructuring und Spread-Operatoren für sauberere Datenmanipulation an. Vermeide direkten Property-Zugriff und Mutation, wenn möglich.

Vermeiden

  • Vermeide es, bereits async Funktionen in neue Promises zu wrappen. Wenn eine Funktion bereits ein Promise zurückgibt, verwende sie direkt mit await.
  • Mutiere keine Eingabedaten in Funktionen. Gib immer neue Objekte oder Arrays mit Spread-Operatoren zurück, um Unveränderlichkeit zu wahren.
  • Vermeide Callback-Pyramiden und übermäßiges Promise-Chaining. Verwende async/await für bessere Lesbarkeit und Fehlerbehandlung.

Häufig gestellte Fragen

Was ist der Unterschied zwischen Arrow-Funktionen und traditionellen Funktionen in JavaScript?
Arrow-Funktionen haben lexikales 'this'-Binding (erben vom umgebenden Gültigkeitsbereich) und können nicht als Konstruktoren verwendet werden. Traditionelle Funktionen haben dynamisches 'this'-Binding und können mit 'new' aufgerufen werden. Verwende Arrow-Funktionen für Callbacks und Methoden, bei denen 'this' nicht ändern sollte.
Wann sollte ich async/await vs Promises direkt verwenden?
Verwende async/await für die meisten Fälle, da es lesbareren Code erzeugt, der ähnlich wie synchroner Code aussieht. Verwende Promises direkt, wenn du mehrere async Operationen mit Promise.all, Promise.race oder Promise.allSettled komponierst.
Wie behandle ich Fehler mit async/await?
Umschließe await-Aufrufe in try/catch-Blöcken. Für mehrere unabhängige async Operationen solltest du in Betracht ziehen, Promise.allSettled zu verwenden, um Fehler graceful zu behandeln, ohne die gesamte Operation zu stoppen.
Was sind die Vorteile funktionaler Programmierung in JavaScript?
Funktionale Programmierung macht Code vorhersagbarer und einfacher zu testen. Reine Funktionen erzeugen immer die gleiche Ausgabe für die gleiche Eingabe und haben keine Seiteneffekte. Array-Methoden wie map, filter und reduce erzeugen verkettbare Transformationen, die lesbar und wartbar sind.
Wann sollte ich Destructuring vs direkten Property-Zugriff verwenden?
Verwende Destructuring, wenn du mehrere Properties aus einem Objekt oder Array extrahieren möchtest. Es macht den Code sauberer und deklariert alle Variablen auf einmal. Verwende direkten Zugriff für einzelnen Property-Zugriff in einfachen Fällen.
Was sind die Performance-Auswirkungen moderner JavaScript-Features?
Moderne JavaScript-Features werden von modernen Engines optimiert. Einige Patterns wie Spread-Operatoren auf großen Arrays können Performance-Overhead erzeugen. Verwende Debouncing und Throttling für Event-Handler. Für intensive Operationen solltest du Generatoren für Lazy-Evaluation in Betracht ziehen.