Can someone share a clear Javascript cheat sheet?

General
1

I’m trying to quickly level up my Javascript skills for a project with a tight deadline, but I keep bouncing between scattered docs and tutorials. It’s slowing me down and I’m worried I’ll miss important core concepts and syntax. Can someone recommend or share a concise, beginner-friendly Javascript cheat sheet that covers essentials like variables, functions, loops, arrays, and common DOM methods, preferably in a printable or easy-to-reference format?

2

Here is a compact JS cheat sheet you can keep in a tab while you work. Focus on these and you cover most project work fast.

  1. Declarations and types

// variables
let x = 1
const y = 2
var z = 3 // avoid unless you know hoisting and function scope

// types
typeof 123 // ‘number’
typeof ‘hi’ // ‘string’
typeof true // ‘boolean’
typeof undefined // ‘undefined’
typeof null // ‘object’ (wart in JS)
typeof {} // ‘object’
typeof // ‘object’
typeof (() => {}) // ‘function’

// check array
Array.isArray() // true

  1. Equality

1 == ‘1’ // true (coercion)
1 === ‘1’ // false (no coercion)
0 == false // true
0 === false // false
// use === and !== almost always

  1. Truthy and falsy

Falsy values:
false, 0, -0, 0n, ‘’, null, undefined, NaN

Everything else is truthy.

if (value) { … } // runs for truthy values

  1. Strings

const s = ‘Hello’
s.length // 5
s.toLowerCase()
s.toUpperCase()
s.includes(‘el’)
s.slice(1, 3) // ‘el’
'hi ’ + ‘there’
Hi ${name} // template literal

  1. Numbers

Number(‘42’) // 42
parseInt(‘42px’) // 42
parseFloat(‘3.14’)
isNaN(value)
Math.round(1.6)
Math.floor(1.6)
Math.ceil(1.2)
Math.random() // 0 <= x < 1

  1. Arrays

const arr = [1, 2, 3]

arr.push(4) // [1,2,3,4]
arr.pop() // removes last
arr.unshift(0) // add at start
arr.shift() // remove first
arr.indexOf(2) // 1
arr.includes(3) // true
arr.join(‘,’) // ‘1,2,3’

// main functional methods
arr.map(x => x * 2)
arr.filter(x => x > 1)
arr.find(x => x === 2)
arr.some(x => x > 2)
arr.every(x => x > 0)
arr.reduce((acc, x) => acc + x, 0)

  1. Objects

const user = {
name: ‘Sam’,
age: 30
}

user.name
user[‘age’]

user.city = ‘NY’
delete user.age

Object.keys(user) // [‘name’,‘city’]
Object.values(user) // [‘Sam’,‘NY’]

// destructuring
const { name, city } = user

  1. Functions

function add(a, b) {
return a + b
}

const sub = function(a, b) {
return a - b
}

const mul = (a, b) => a * b

// default params
function greet(name = ‘Anon’) {
return 'Hi ’ + name
}

  1. Scope and this

// block scope
if (true) {
let a = 1
}
// a not accessible here

// arrow functions do not rebind this
const obj = {
value: 1,
inc() {
this.value++
}
}

  1. Promises and async

function wait(ms) {
return new Promise(resolve => {
setTimeout(resolve, ms)
})
}

// async / await
async function run() {
try {
await wait(1000)
console.log(‘done’)
} catch (err) {
console.error(err)
}
}

  1. Fetch

async function getJson(url) {
const res = await fetch(url)
if (!res.ok) {
throw new Error('HTTP ’ + res.status)
}
return res.json()
}

  1. Common patterns for real projects

// optional chaining and nullish coalescing
const street = user.address?.street
const theme = settings.theme ?? ‘light’

// spread operator
const arr2 = […arr, 4, 5]
const user2 = { …user, age: 25 }

// array from data
const ids = items.map(item => item.id)

  1. Quick DOM

const el = document.querySelector(‘#id’)

el.textContent = ‘Hello’
el.classList.add(‘active’)

el.addEventListener(‘click’, () => {
console.log(‘clicked’)
})

  1. Error handling

try {
risky()
} catch (err) {
console.error(err.message)
}

If you want to level up fast, drill these:

  1. map, filter, reduce
  2. async / await with fetch
  3. destructuring and spread
  4. optional chaining and nullish coalescing

Build a tiny feature in your project using each, even if it feels overkill. That reps the syntax into your head quicker than jumping around docs.

3

Nice, the stuff from @techchizkid covers the “what” pretty well. I’d add a layer that helps you work faster, not just remember syntax. Consider this more of a “JS working habits” cheat sheet than pure API listing.

1. Mental model checklist (use this per file)

When you open a JS file, quickly ask:

  • What’s input and output of this module / function?
  • Is this sync or async?
  • What’s mutable vs immutable here?
  • Where can this throw or reject?

If you can answer those four, you usually won’t get lost in a real project.

2. Core language “gotchas” you actually hit under deadline

Hoisting (very short version)
Just remember:

// works, but weird
foo()
function foo() {}

// DON'T do this and expect the same:
bar()       // TypeError
const bar = () => {}

So: function declarations are hoisted, const / let are not usable before definition.

This rule of thumb:

  • Use const by default
  • Use let if you must reassign
  • Never use var in new code

3. Real project patterns

Guard clauses reduce nesting and make bug hunting easier:

function saveUser(user) {
  if (!user) throw new Error('user required')
  if (!user.id) throw new Error('id required')

  // happy path below
}

Early returns > giant pyramids of if / else.

4. Async in actual code, not examples

Most bugs under time pressure are here.

Rule: never ignore rejections.

async function handleClick() {
  try {
    const data = await getJson('/api/items')
    render(data)
  } catch (err) {
    showError(err.message || 'Something went wrong')
  }
}

If you call async stuff in Array.map, remember:

// WRONG: results is array of promises
const results = items.map(async item => fetchItem(item))

// RIGHT:
const results = await Promise.all(
  items.map(item => fetchItem(item))
)

This one hits people constantly.

5. Minimal module patterns

If your project uses modules, keep it boring:

// utils/math.js
export function add(a, b) {
  return a + b
}

export function clamp(n, min, max) {
  return Math.min(max, Math.max(min, n))
}

Avoid fancy “default plus named export plus class plus whatever” combos when rushing. Simple named exports are easiest to refactor.

6. Debugging speed hacks

Under a deadline, this matters more than memorizing APIs.

  • Use console.log({ someVar }) instead of console.log(someVar) so you know what is what.
  • Log the shape, not everything:
console.log(user && Object.keys(user))
  • Use debugger:
function compute(value) {
  debugger
  // step through in dev tools
}

Single debugger line can save you 25 mins of guesswork.

7. “Did I miss a core concept?” sanity list

If you’re comfortable with these, you’re fine for most real projects:

  • Values vs references (primitives vs objects/arrays)
  • Function basics + arrow functions
  • Closures (using outer variables inside inner functions)
  • this in methods vs arrow functions
  • Promises / async-await
  • Modules (import / export)
  • Basic DOM events if you’re in the browser

Don’t go down the rabbit hole on prototypes, call/apply/bind, or weird coercion edge cases right now unless your code forces you to.

Last tiny tip: build one very small “practice feature” in your project where you deliberately use the patterns you just read and the methods @techchizkid listed. Same codebase, tiny scope, on purpose. Muscle memory > reading even more cheatsheets.