Back to Cheatsheet Grid
JavaScript 10 Snippets

JavaScript ES6+ Cheatsheet

Modern JavaScript syntax references: arrow functions, destructuring, spreads, promises, and async operations.

Variables & Scope

const { name, age } = user;

Extract properties from object references directly.

const user = { name: "Alice", age: 25 }; const { name } = user;
const merged = { ...obj1, ...obj2 };

Merge objects using the ES6 spread operator.

const merged = { ...{a:1}, ...{b:2} };
const [first, ...rest] = arr;

Destructure array index positions into variables.

const [first, ...rest] = [10, 20, 30];

Promises & Networking

fetch(url).then(res => res.json())

Execute network fetch requests with Promises.

fetch("/api/data").then(r => r.json()).then(console.log)
async function getData() { const r = await fetch(url); }

Declare async method to await asynchronous outcomes.

async function load() { const res = await fetch("/api"); }
Promise.all([p1, p2]).then(...)

Await completion on parallel network request maps.

Promise.all([fetch("/u"), fetch("/p")]).then(console.log)

Array Utilities

arr.map(x => x * 2)

Transform all list array values into a new array.

const doubled = [1, 2, 3].map(x => x * 2);
arr.filter(x => x > 10)

Extract subset from array matching boolean filter test.

const high = [5, 12, 8, 15].filter(x => x > 10);
arr.reduce((acc, x) => acc + x, 0)

Accumulate values within lists into singular results.

const sum = [1,2,3].reduce((sum, val) => sum + val, 0);
arr.find(x => x.id === target)

Locate specific items within list configurations.

const user = users.find(u => u.id === 5);