JavaScript cheat sheet
Modern JavaScript (ES2015 and later) for quick lookup.
Variables and types
const x = 1;- Constant binding (prefer this)
let y = 2;- Reassignable variable
`Hello ${name}`- Template string
a === b- Strict equality (avoid ==)
typeof x- Type of a value
a ?? b a?.b- Default for null/undefined; safe property access
Functions
function add(a, b) { return a + b; }- Function declaration
const add = (a, b) => a + b;- Arrow function
function f(a, b = 1) {}- Default parameter
const { a, b } = obj;- Destructure an object
const [first, ...rest] = arr;- Destructure an array
Arrays
arr.push(x) arr.pop()- Add or remove at the end
arr.map(fn)- New array with each item transformed
arr.filter(fn)- Items that pass the test
arr.reduce((acc, n) => acc + n, 0)- Fold into one value
arr.find(fn) arr.includes(x)- First match; contains?
[...a, ...b]- Spread: combine arrays
Objects and JSON
const o = { a: 1, b: 2 };- Object literal
Object.keys(o) Object.entries(o)- Keys; key-value pairs
{ ...o, a: 3 }- Copy with a change
JSON.stringify(o)- Object to JSON text
JSON.parse(text)- JSON text to object
DOM and events
document.querySelector("#id")- First element matching a CSS selector
document.querySelectorAll(".x")- All matching elements
el.textContent = "Hi"- Set text safely
el.classList.toggle("on")- Toggle a CSS class
el.addEventListener("click", fn)- React to an event
Async
const res = await fetch(url);- Request a URL
if (!res.ok) throw new Error(res.status);- fetch does not fail on 404 by itself
const data = await res.json();- Parse a JSON response
try { ... } catch (e) { ... }- Handle errors
Promise.all([a, b])- Wait for several promises
Learn it properly