JavaScript
Cheat Sheet
ES6+, DOM manipulation, async/await, and modern patterns. From basics to advanced.
ES6+ Features
Arrow Functions
const add = (a, b) => a + b;
const square = x => x ** 2;Destructuring
const { name, age } = person;
const [first, second] = array;Template Literals
const msg = `Hello, ${name}!`;
const multi = `
Line 1
Line 2
`;Arrays
Map, Filter, Reduce
const doubled = arr.map(x => x * 2);
const evens = arr.filter(x => x % 2 === 0);
const sum = arr.reduce((a, b) => a + b, 0);Spread & Rest
const copy = [...arr];
const merged = [...arr1, ...arr2];
const sum = (...nums) => nums.reduce((a, b) => a + b);DOM Manipulation
Selectors
document.getElementById('id');
document.querySelector('.class');
document.querySelectorAll('div');Events
element.addEventListener('click', handler);
element.removeEventListener('click', handler);Async/Await
Fetch API
async function getData() {
const response = await fetch(url);
const data = await response.json();
return data;
}Error Handling
try {
const data = await getData();
} catch (error) {
console.error(error);
}Download
Print this page or save as PDF for quick reference.
Tip: Use Ctrl+P (Cmd+P on Mac) to print or save as PDF.