Home/AI Code Generation & Quality/modern-javascript-patterns
M

modern-javascript-patterns

by @wshobsonv
4.6(120)

This skill helps developers master modern JavaScript (ES6+) features and functional programming patterns, including async/await, destructuring, Promises, and modules. It guides in writing clean, efficient, and maintainable code, making it ideal for refactoring legacy code, optimizing performance, or implementing contemporary development practices. By applying these patterns, developers can significantly enhance code quality and development efficiency.

javascriptes6functional-programmingcode-qualityrefactoringGitHub
Installation
npx skills add https://github.com/wshobson/agents --skill modern-javascript-patterns
compare_arrows

Before / After Comparison

1
Before

Reviewing JavaScript code with outdated syntax and complex logic often requires significant time for team members to understand the intent, leading to prolonged development cycles and missed potential issues.

After

By adopting modern JavaScript patterns, code becomes clear and easy to understand. Team members can review code much faster, significantly reducing review time and improving overall development efficiency and code quality.

SKILL.md

Modern JavaScript Patterns

Comprehensive guide for mastering modern JavaScript (ES6+) features, functional programming patterns, and best practices for writing clean, maintainable, and performant code.

When to Use This Skill

  • Refactoring legacy JavaScript to modern syntax
  • Implementing functional programming patterns
  • Optimizing JavaScript performance
  • Writing maintainable and readable code
  • Working with asynchronous operations
  • Building modern web applications
  • Migrating from callbacks to Promises/async-await
  • Implementing data transformation pipelines

Detailed patterns and worked examples

Detailed pattern documentation lives in references/details.md. Read that file when the navigation tier above is insufficient.

Best Practices

  1. Use const by default: Only use let when reassignment is needed
  2. Prefer arrow functions: Especially for callbacks
  3. Use template literals: Instead of string concatenation
  4. Destructure objects and arrays: For cleaner code
  5. Use async/await: Instead of Promise chains
  6. Avoid mutating data: Use spread operator and array methods
  7. Use optional chaining: Prevent "Cannot read property of undefined"
  8. Use nullish coalescing: For default values
  9. Prefer array methods: Over traditional loops
  10. Use modules: For better code organization
  11. Write pure functions: Easier to test and reason about
  12. Use meaningful variable names: Self-documenting code
  13. Keep functions small: Single responsibility principle
  14. Handle errors properly: Use try/catch with async/await
  15. Use strict mode: 'use strict' for better error catching

For common pitfalls (this binding, promise anti-patterns, memory leaks), see references/advanced-patterns.md.

User Reviews (0)

Write a Review

Effect
Usability
Docs
Compatibility

No reviews yet

Statistics

Installs15.9K
Rating4.6 / 5.0
Version
Updated2026年7月8日
Comparisons1

User Rating

4.6(120)
5
37%
4
43%
3
13%
2
5%
1
2%

Rate this Skill

0.0

Compatible Platforms

🤖claude-code

Timeline

Created2026年5月29日
Last Updated2026年7月8日
🎁 Agent Knowledge Cards
Survey