# Modernize JavaScript with Proven ES6\+ Patterns

Legacy JavaScript is difficult to maintain and often hides asynchronous errors. This skill guides refactoring with ES6+, functional patterns, modules, and performance practices.

## Install

```bash
npx skillstore add sickn33/modern-javascript-patterns
```

## Metadata

- Status: approved
- Slug: sickn33-modern-javascript-patterns
- Skillstore revision: r2
- Version status: missing
- Tree hash: 693d7d761b00d35514d2a6a05927e5a518947490c7f7ef7a80e054e143bacf30
- Author: sickn33
- GitHub username: sickn33
- License: MIT
- Repository: https://github.com/sickn33/antigravity-awesome-skills/tree/main/skills/modern-javascript-patterns
- Ref: 81e05e636292629114b76cbb3922fbe57672fc02
- Supported tools: Claude, Codex, Claude Code
- Audit status: complete
- Agent install advisory: allowed
- Manual install advisory: allowed
- Artifact signature: available
- Audit attestation: unavailable
- Human verification: not\_verified
- Risk factors: scripts, external\_commands, network
- Quality score: 69
- Public page: https://skillstore.pages.dev/skills/sickn33-modern-javascript-patterns
- Manifest: https://skillstore.pages.dev/api/skills/sickn33-modern-javascript-patterns/manifest

## Capabilities

- Explains arrow functions, destructuring, spread syntax, template literals, and enhanced object literals.
- Guides migrations from callbacks and Promise chains to async and await.
- Applies array methods, higher-order functions, composition, pure functions, and immutable updates.
- Demonstrates classes, modules, iterators, generators, optional chaining, and nullish coalescing.
- Reviews lazy evaluation, memoization, event handling, and other performance techniques.

## Use Cases

- Refactor Legacy Frontend Code: Replace callbacks, manual loops, and repetitive object handling with readable modern JavaScript.
- Standardize Team Patterns: Create consistent guidance for asynchronous flows, immutable updates, modules, and error handling.
- Learn Modern JavaScript: Study focused examples covering ES6\+ syntax, functional programming, classes, generators, and performance.

## Prompt Templates

### Explain a Modern Feature

```
Explain [JavaScript feature] with one practical example. Compare it with the older syntax and identify common mistakes.
```

### Refactor a Function

```
Refactor this JavaScript function using appropriate ES6+ patterns: [function]. Preserve behavior and explain each meaningful change.
```

### Modernize Async Control Flow

```
Rewrite this callback or Promise workflow with async and await: [code]. Add error handling and preserve concurrency where useful.
```

### Review a JavaScript Module

```
Review this module for maintainability, immutability, asynchronous correctness, and performance: [module]. Propose prioritized changes with validation steps.
```

## Limitations

- Provides general patterns rather than framework-specific architecture.
- Does not run, benchmark, or test the resulting JavaScript.
- Examples may require changes for browser, Node.js, or build-tool compatibility.
- Security-sensitive examples require production libraries and environment-specific review.

## Best Practices

- Preserve behavior with tests before refactoring syntax or control flow.
- Choose patterns that improve clarity instead of applying every modern feature.
- Validate runtime support, error paths, and performance assumptions in the target environment.

## Anti Patterns

- Do not convert dependent asynchronous steps into uncontrolled parallel work.
- Do not assume object spread creates deep copies of nested data.
- Do not place untrusted values into HTML or dynamic import paths without validation.

## Security Audit

- Audited at: 2026-08-04T14:46:47.371\+00:00
- Summary: All 29 static findings are false positives from Markdown examples, JavaScript template literals, or inline file references. Two educational examples remain unsafe: fake password hashing and unescaped HTML interpolation.

## Stats

- Views: 147
- Downloads: 11
- Favorites: 0
- Popularity score: 0