modern-javascript-patterns
wshobson/agents
Master ES6+ features and modern JavaScript patterns for clean, efficient code.
What is modern-javascript-patterns?
Comprehensive guide to ES6+ syntax including async/await, destructuring, arrow functions, promises, and functional programming patterns. Use when refactoring legacy code, optimizing performance, or building modern JavaScript applications.
- Learn async/await and Promise patterns for asynchronous operations
- Master destructuring, spread operators, and arrow functions for cleaner syntax
- Implement functional programming patterns and data transformation pipelines
- Use modules, iterators, and generators for better code organization
- Apply best practices like const/let, template literals, and optional chaining
- Avoid common pitfalls including this binding issues, promise anti-patterns, and memory leaks
How to install modern-javascript-patterns
npx skills add https://github.com/wshobson/agents --skill modern-javascript-patternsHow to use modern-javascript-patterns
- 1.Review the best practices section for core principles like const/let usage and arrow functions
- 2.Consult references/details.md for comprehensive pattern documentation and worked examples
- 3.Reference references/advanced-patterns.md for handling this binding, promise anti-patterns, and memory leaks
- 4.Apply patterns incrementally when refactoring or building new features
- 5.Use async/await for asynchronous operations instead of Promise chains
Use cases
- Refactoring legacy callback-based code to async/await patterns
- Implementing functional data transformation pipelines
- Optimizing performance through modern array methods and immutable patterns
- Migrating from traditional loops to modern iteration approaches
- Building maintainable web applications with proper module organization
- JavaScript developers modernizing codebases
- Frontend engineers building modern web applications
- Backend Node.js developers
- Developers transitioning from legacy to ES6+ syntax
modern-javascript-patterns FAQ
Use const by default for variables that won't be reassigned. Use let only when you need to reassign a variable. Avoid var in modern JavaScript.
Prefer arrow functions for callbacks and short functions. Use regular functions when you need dynamic this binding or named function expressions for recursion.
Destructuring extracts values from objects and arrays into separate variables, making code more readable and reducing repetitive property access.
Use try/catch blocks around await expressions to handle errors properly, similar to synchronous error handling.
Detailed pattern documentation and worked examples are in references/details.md. Advanced patterns and common pitfalls are covered in references/advanced-patterns.md.
Full instructions (SKILL.md)
Source of truth, from wshobson/agents.
name: modern-javascript-patterns description: Master ES6+ features including async/await, destructuring, spread operators, arrow functions, promises, modules, iterators, generators, and functional programming patterns for writing clean, efficient JavaScript code. Use when refactoring legacy code, implementing modern patterns, or optimizing JavaScript applications.
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
- Use const by default: Only use let when reassignment is needed
- Prefer arrow functions: Especially for callbacks
- Use template literals: Instead of string concatenation
- Destructure objects and arrays: For cleaner code
- Use async/await: Instead of Promise chains
- Avoid mutating data: Use spread operator and array methods
- Use optional chaining: Prevent "Cannot read property of undefined"
- Use nullish coalescing: For default values
- Prefer array methods: Over traditional loops
- Use modules: For better code organization
- Write pure functions: Easier to test and reason about
- Use meaningful variable names: Self-documenting code
- Keep functions small: Single responsibility principle
- Handle errors properly: Use try/catch with async/await
- Use strict mode:
'use strict'for better error catching
For common pitfalls (this binding, promise anti-patterns, memory leaks), see references/advanced-patterns.md.
Related skills
More from wshobson/agents and the wider catalog.
tailwind-design-system
Build production-ready design systems with Tailwind CSS v4, design tokens, and component libraries.
typescript-advanced-types
Master TypeScript's advanced type system: generics, conditional types, mapped types, and utility types for type-safe applications.
nodejs-backend-patterns
Build production-ready Node.js backends with Express/Fastify, middleware patterns, auth, and database integration.
python-performance-optimization
Profile and optimize Python code using cProfile, memory profilers, and performance best practices.
brand-landingpage
Brand-first landing page designer with guided interviews and Stitch-powered iteration.
python-testing-patterns
Implement comprehensive testing strategies with pytest, fixtures, mocking, and test-driven development.