JavaScript Basics Cheat Sheet

Covering the basics and basic syntax of JavaScript Code

Download as .pdf

API: /api/v1/cheatsheet/javascript-basics-cheat-sheet

1. Variables & Declarations

javascript

1
2
3
let x = 10;      // block-scoped (preferred)
const y = 20;    // constant (cannot reassign)
var z = 30;      // function-scoped (avoid)
  • const ≠ immutable (objects can still change)
  • Always prefer const → fallback to let

2. Data Types

Primitive: string, number, boolean, null, undefined, symbol, bigint

Reference: object, array, function

javascript

1
2
typeof "hi"      // "string"
typeof null      // "object" (quirk)

3. Operators

Arithmetic: + - * / % **

Comparison: - == // loose (avoid) - === // strict (preferred) - != !== > < >= <=

Logical: - && || ! - Nullish / Optional - a ?? b // null/undefined fallback - obj?.x // safe access


4. Control Flow

If / Else

javascript

1
2
3
4
5
6
7
if (x > 10) {
  ...
} else if (...) {
  ...
} else {
  ...
}

Switch

javascript

1
2
3
4
switch (val) {
  case 1: break;
  default: break;
}

Ternary: const result = condition ? a : b;


5. Loops

javascript

1
2
3
4
5
6
7
8
for (let i = 0; i < 5; i++) {}

while (condition) {}

do {} while (condition);

for (const item of array) {}   // values
for (const key in object) {}   // keys

6. Functions

Declaration

javascript

1
2
3
function add(a, b) {
  return a + b;
}

Arrow Function

javascript

1
const add = (a, b) => a + b;

Default Parameters

javascript

1
function greet(name = "Guest") {}

Rest Parameters

javascript

1
function sum(...nums) {}

7. Objects

javascript

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
const user = {
  name: "Alice",
  age: 25,
  greet() {
    console.log(this.name);
  }
};

//Access
user.name
user["name"]
Destructuring
const { name, age } = user;

8. Arrays

javascript

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
const arr = [1, 2, 3];

//Common Methods
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(2)

//Destructuring
const [a, b] = arr;

9. Spread & Rest

javascript

1
2
3
4
const newArr = [...arr];
const obj2 = { ...obj };

function fn(...args) {}

10. Asynchronous JavaScript

javascript

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
// Callback
setTimeout(() => {}, 1000);

// Promise
const p = new Promise((res, rej) => {
  res("done");
});
p.then(result => {}).catch(err => {});

// Async/Await
async function run() {
  const data = await fetch(url);
}

11. Fetch API

javascript

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
fetch("https://api.com")
  .then(res => res.json())
  .then(data => console.log(data));
 ```

 ---

###12. Classes

```javascript
class Person {
  constructor(name) {
    this.name = name;
  }

  greet() {
    console.log(this.name);
  }
}

// Inheritance
class Student extends Person {
  constructor(name, grade) {
    super(name);
    this.grade = grade;
  }
}

13. Error Handling

javascript

1
2
3
4
5
6
7
try {
  ...
} catch (err) {
  console.error(err);
} finally {
  ...
}

14. Type Conversion

javascript

1
2
3
Number("123")
String(123)
Boolean(0)   // false

--

15. Equality Rules

javascript

1
2
0 == false     // true (coercion)
0 === false    // false

Use === always unless you need coercion


16. Useful Built-ins

javascript

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
// Math
Math.random()
Math.floor()
Math.max()

// Date
new Date()
Date.now()

// JSON
JSON.stringify(obj)
JSON.parse(str)

17. Modules (ESM)

javascript

1
2
3
4
5
6
7
// export
export const x = 1;
export default function() {}

// import
import x from "./file.js";
import { y } from "./file.js";

18. Scope

  • var → function scope
  • let, const → block scope
javascript

1
2
3
{
  let x = 10;
}

19. this Keyword

  • Object method → object
  • Arrow function → inherited (lexical)
  • Global → window (browser) / undefined (strict mode)

20. Quick Reference

  • let / const
  • === (strict)
  • => (arrow function)
  • ... (spread/rest)
  • ?. (optional chaining)
  • ?? (nullish coalescing)
  • async/await
  • map/filter/reduce

Join the Newsletter

Practical insights on Django, backend systems, deployment, architecture, and real-world development — delivered without noise.

Get updates when new guides, learning paths, cheat sheets, and field notes are published.

No spam. Unsubscribe anytime.



There is no third-party involved so don't worry - we won't share your details with anyone.