JavaScript Course

Cheatsheet

A quick reference — the essential syntax of modern JavaScript on a single page. Use Ctrl/Cmd + P to print it.

Variables and types

Declarations

let x = 10;        // reassignable
const PI = 3.14;   // non-reassignable
// no var in modern code

Prefer const, choose let only if you need to reassign.

Primitive types

typeof 'ciao'    // 'string'
typeof 42        // 'number'
typeof true      // 'boolean'
typeof undefined // 'undefined'
typeof null      // 'object'  (historical)
typeof 10n       // 'bigint'

Comparisons

1 === '1'   // false  (no coercion)
1 ==  '1'   // true   (coercion - avoid)
NaN === NaN // false   -> use Number.isNaN(x)

Always use === / !==, never == / !=.

Explicit conversions

Number('42')  // 42
String(42)    // '42'
Boolean(0)    // false
parseInt('1a', 10) // 1

Strings

Template literals

const nome = 'Mondo';
const msg = `Ciao, ${nome}!`;
const multilinea = `riga 1
riga 2`;

Common methods

'ciao'.length            // 4
'ciao'.toUpperCase()     // 'CIAO'
'  ciao  '.trim()        // 'ciao'
'a,b,c'.split(',')       // ['a','b','c']
['a','b','c'].join('-')  // 'a-b-c'
'hello'.includes('ell')  // true
'hello'.slice(1, 4)      // 'ell'
'abc'.replace('b', 'X')  // 'aXc'

Numbers and Math

Math.max(1, 2, 3)   // 3
Math.min(...arr)
Math.round(1.6)     // 2
Math.floor(1.9)     // 1
Math.ceil(1.1)      // 2
Math.abs(-5)        // 5
(1.2345).toFixed(2) // '1.23'

Arrays

Create and access

const a = [1, 2, 3];
a[0]               // 1
a.length           // 3
a.push(4)          // [1,2,3,4]
a.pop()            // removes and returns the last element
a.unshift(0); a.shift();

Spread and copy

const b = [...a, 4, 5];
const copia = [...a];
const max = Math.max(...a);

Functional — map / filter

[1,2,3].map((n) => n * 2)        // [2,4,6]
[1,2,3,4].filter((n) => n % 2)   // [1,3]

Functional — reduce

[1,2,3,4].reduce((acc, n) => acc + n, 0)   // 10
[1,2,3].reduce((acc, n) => Math.max(acc, n), -Infinity)

[1,2,3].find((n) => n > 1)        // 2
[1,2,3].findIndex((n) => n > 1)   // 1
[1,2,3].some((n) => n > 2)        // true
[1,2,3].every((n) => n > 0)       // true
[1,2,3].includes(2)               // true

Sorting

// In-place (mutates!)
[3,1,2].sort((a, b) => a - b)     // [1,2,3]
// Non-destructive copy
[3,1,2].toSorted((a, b) => b - a) // [3,2,1]

sort() is lexicographical by default: pass a comparator function.

Objects

Create and access

const u = { nome: 'Alice', eta: 30 };
u.nome           // 'Alice'
u['nome']        // 'Alice'
u.email = 'x@y'; // add
delete u.eta;

Destructuring

const { nome, eta = 0 } = u;
const { nome: n } = u;       // rename
const [primo, ...resto] = [1,2,3];

Spread and merge

const u2 = { ...u, eta: 31 };  // copy + override
const merged = { ...a, ...b };

Iteration

Object.keys(u)        // ['nome','eta']
Object.values(u)      // ['Alice', 30]
Object.entries(u)     // [['nome','Alice'], ['eta',30]]
for (const [k, v] of Object.entries(u)) { /* ... */ }

From/to entries

Object.fromEntries([['a', 1], ['b', 2]])  // { a: 1, b: 2 }

Functions

Shapes

function somma(a, b) { return a + b; }
const somma = (a, b) => a + b;
const saluta = (nome = 'Mondo') => `Ciao, ${nome}`;

Rest and spread

function somma(...numeri) {
  return numeri.reduce((a, b) => a + b, 0);
}
somma(1, 2, 3);             // 6
somma(...[1, 2, 3]);        // 6

Closure

function contatore() {
  let n = 0;
  return () => ++n;
}
const c = contatore();
c(); c(); c();   // 3

The inner function "remembers" the variables of the outer one.

Higher-order functions

const moltiplica = (k) => (n) => n * k;
const doppio = moltiplica(2);
doppio(5);   // 10

Flow Control

if / else

if (x > 0) {
  // ...
} else if (x === 0) {
  // ...
} else {
  // ...
}
// Ternary
const etichetta = x > 0 ? 'positivo' : 'non positivo';

switch

switch (giorno) {
  case 'sab':
  case 'dom':
    return 'weekend';
  default:
    return 'feriale';
}

Loops

for (let i = 0; i < n; i++) { /* ... */ }
for (const v of arr) { /* values */ }
for (const k in obj) { /* keys */ }
while (cond) { /* ... */ }
do { /* at least once */ } while (cond);

for…of on arrays (values); for…in on objects (keys).

break / continue

for (const n of nums) {
  if (n < 0) continue;  // skip
  if (n > 100) break;   // exit
  // ...
}

try / catch / finally

try {
  const r = puoFallire();
} catch (err) {
  console.error(err.message);
} finally {
  // always, whether success or failure
}

Asynchronous

Promises

Promise.resolve(42);
Promise.reject(new Error('no'));
p.then((v) => console.log(v))
 .catch((err) => console.error(err));

async / await

async function carica() {
  const r = await fetch('/api/dati');
  if (!r.ok) throw new Error('HTTP ' + r.status);
  return await r.json();
}
const dati = await carica();

await only inside async functions (or ESM modules with top-level await).

Asynchronous errors

async function leggiSicuro() {
  try {
    return await carica();
  } catch (err) {
    return null;
  }
}

Combinators

Promise.all([p1, p2, p3])         // all ok, first rejection exits immediately
Promise.allSettled([p1, p2, p3])  // always array of outcomes
Promise.race([p1, p2])            // the first one to resolve

ESM Modules

export / import

// somma.js
export function somma(a, b) { return a + b; }
export const PI = 3.14;

// app.js
import { somma, PI } from './somma.js';

Default export

// log.js
export default function log(msg) { /* ... */ }

// app.js
import log from './log.js';

Re-export

export { somma as add } from './somma.js';
export * from './utils.js';

JavaScript · Cheatsheet — eLearner.app