Skip to content
Cheatsheets & Quick References
JavaScript Cheatsheet — Complete Quick Reference

JavaScript Cheatsheet — Complete Quick Reference

DodaTech 3 min read

JavaScript syntax from ES6 onward: variables, arrays, objects, functions, classes, promises, DOM manipulation, and event handling — all in one compact page.

Variables

KeywordScopeMutableHoisted
varFunctionYesYes (undefined)
letBlockYesNo (TDZ)
constBlockNo (reassign)No (TDZ)

Data Types 

// Primitive: string, number, boolean, null, undefined, symbol, bigint
typeof "hi"   // "string"
typeof 42     // "number"
typeof true   // "boolean"
typeof null   // "object" (historical bug)

Arrays 

const arr = [1, 2, 3];
arr.push(4); arr.pop(); arr.shift(); arr.unshift(0);
arr.map(x => x*2); arr.filter(x => x > 1);
arr.reduce((a, b) => a + b, 0);
arr.find(x => x === 2); arr.includes(3);
arr.slice(1, 3); arr.splice(1, 1);

Objects 

const obj = { name: "JS", year: 1995 };
obj.name; obj["year"];
Object.keys(obj); Object.values(obj); Object.entries(obj);
const copy = { ...obj, extra: true };   // spread

Functions & Arrow Functions 

function add(a, b = 0) { return a + b; }
const mul = (a, b) => a * b;            // arrow
const sq = x => x * x;                  // single param

Template Literals 

const msg = `Hello ${name}, you are ${age}`;
const multiline = `line1
line2`;

Destructuring 

const [a, b] = [1, 2];           // array
const { name, age } = person;    // object
const { name: fullName } = person; // rename

Error Handling 

try {
  throw new Error("Something went wrong");
} catch (err) {
  console.error(err.message);
} finally {
  cleanup(); // always runs
}

// Custom errors
class ValidationError extends Error {
  constructor(msg) { super(msg); this.name = "ValidationError"; }
}

Spread & Rest 

const merged = [...arr1, ...arr2];   // spread
const sum = (...nums) => nums.reduce((a,b)=>a+b); // rest

Classes 

class Animal {
  constructor(name) { this.name = name; }
  speak() { return `${this.name} speaks`; }
  static create(name) { return new Animal(name); }
}

Promises & Async/Await 

fetch(url)
  .then(res => res.json())
  .catch(err => console.error(err));

async function load() {
  try {
    const res = await fetch(url);
    const data = await res.json();
  } catch (err) { console.error(err); }
}

DOM Methods 

document.querySelector(".class");        // first match
document.querySelectorAll("div");         // NodeList
document.getElementById("id");
el.textContent = "new text";
el.innerHTML = "<b>bold</b>";
el.style.color = "red";
el.classList.add("active");
el.setAttribute("data-id", "123");
document.createElement("div");
parent.appendChild(child);

Event Handling 

el.addEventListener("click", (e) => {
  e.preventDefault();
  console.log(e.target);
});
// Common: click, submit, keydown, input, change, mouseover
What is the difference between `let` and `var`?
let is block-scoped (limited to {}) and is not hoisted to the top of its scope — accessing it before declaration throws a ReferenceError. var is function-scoped and hoisted with undefined. Prefer let in modern code.
What is the event loop in JavaScript?
The event loop allows JavaScript (single-threaded) to handle async operations. It continuously checks the call stack and callback queue — when the stack is empty, it pushes pending callbacks (like setTimeout or fetch responses) onto the stack for execution.
What does the spread operator do?
The spread operator (...) expands an iterable (array, object, string) into individual elements. Use it to copy arrays ([...arr]), merge objects ({...a, ...b}), or pass array elements as function arguments (Math.max(...nums)).

See the full JavaScript guides for more depth.

Previous Python Cheatsheet — Complete Quick Reference Next Git Cheatsheet — Common Commands Quick Reference

Built by the developers of DodaTech

Doda Browser, DodaZIP & Durga Antivirus Pro

Home Browse Cheatsheets & Quick References