JavaScript Cheatsheet
A quick reference guide for modern JavaScript (ES6+), covering variables, functions, data structures, and asynchronous programming.
1. Variable Declarations
// let: block-scoped, mutable
let count = 0;
count = 1;
// const: block-scoped, immutable reference (objects/arrays can still be mutated)
const user = { name: "Alice" };
user.name = "Bob"; // Allowed
// var: function-scoped, hoisted (avoid using in modern JS)
var oldWay = true;
2. Functions
// Function Declaration (hoisted)
function greet(name) {
return `Hello, ${name}!`;
}
// Function Expression
const greetExpr = function(name) {
return `Hello, ${name}!`;
};
// Arrow Function (lexical `this`)
const add = (a, b) => a + b;
const multiline = (x) => {
const result = x * 2;
return result;
};
// Default Parameters
const multiply = (a, b = 1) => a * b;
3. Arrays and Array Methods
const arr = [1, 2, 3, 4, 5];
// Mutating methods
arr.push(6); // Add to end
arr.pop(); // Remove from end
arr.unshift(0); // Add to start
arr.shift(); // Remove from start
arr.splice(1, 2); // Remove/replace items at index
// Non-mutating (pure) methods
const doubled = arr.map(x => x * 2);
const evens = arr.filter(x => x % 2 === 0);
const sum = arr.reduce((acc, curr) => acc + curr, 0);
const found = arr.find(x => x > 3);
const hasThree = arr.includes(3);
// Destructuring & Spread
const [first, second, ...rest] = arr;
const combined = [...arr, 6, 7, 8];
4. Objects
const person = {
name: "Jane",
age: 28,
greet() {
console.log("Hi!");
}
};
// Accessing properties
person.name;
person["age"];
// Object Methods
Object.keys(person); // ['name', 'age', 'greet']
Object.values(person); // ['Jane', 28, f]
Object.entries(person); // [['name', 'Jane'], ...]
// Destructuring & Rest/Spread
const { name, age: userAge } = person;
const clone = { ...person, location: "NY" };
// Optional Chaining & Nullish Coalescing
const zip = person.address?.zipCode ?? "00000";
5. Promises and Async/Await
// Creating a Promise
const fetchData = () => {
return new Promise((resolve, reject) => {
setTimeout(() => resolve("Data loaded!"), 1000);
});
};
// Using .then().catch()
fetchData()
.then(data => console.log(data))
.catch(err => console.error(err));
// Async/Await (Modern approach)
async function getData() {
try {
const data = await fetchData();
console.log(data);
} catch (error) {
console.error("Failed:", error);
}
}
// Promise Combinators
Promise.all([p1, p2]); // Waits for all to resolve, or any to reject
Promise.allSettled([...]); // Waits for all, regardless of reject/resolve
Promise.race([...]); // Returns first to finish (resolve or reject)
Promise.any([...]); // Returns first to resolve
6. Template Literals
const name = "World";
const greeting = `Hello, ${name}!
You can even have
multi-line strings.`;
7. Modules (ES6)
// Named Export
export const API_KEY = "123";
export function helper() {}
// Default Export
export default class User {}
// Importing
import User, { API_KEY, helper } from './module.js';
import * as utils from './utils.js';