JS
JavaScript Skills Showcase
Interactive demonstrations of JavaScript fundamentals, ES6+ features, and async programming
Skills Demonstrated
ES6+ Features
Arrow Functions Destructuring Spread/Rest Template Literals
Array Methods
map filter reduce sort find
Async Programming
Promises async/await fetch Callbacks
Core Concepts
Closures Scope this Prototypes
Array Methods map/filter/reduce
Transform and manipulate arrays with functional methods
Click a button to transform the array
Promises async/await
Handle asynchronous operations elegantly
Ready to run...
Destructuring ES6
Extract values from objects and arrays efficiently
const user = { name: 'Justin', role: 'Developer' };
const { name, role } = user;
Closures Scope
Functions that remember their lexical environment
Counter using closure:
0
Template Literals ES6
Dynamic string creation with embedded expressions
Spread/Rest ES6
Expand and collect array/object elements
const merged = [...arr1, ...arr2];
Object Methods keys/values/entries
Iterate and transform objects efficiently
Fetch API HTTP Requests
Make network requests with the modern Fetch API
Click to fetch data from API
Event Handling DOM Events
Respond to user interactions dynamically
Hover, click, or type!
Events will appear here
Local Storage Web Storage API
Persist data in the browser