Vai al contenuto
eLearner.app

Corso JavaScript

Cheatsheet

Un riferimento veloce — la sintassi essenziale di JavaScript moderno su una pagina sola. Usa Ctrl/Cmd + P per stamparla.

JavaScript · Cheatsheet — eLearner.app

Variabili e tipi

  • Dichiarazioni

    let x = 10;        // riassegnabile
    const PI = 3.14;   // non riassegnabile
    // niente var nel codice moderno

    Preferisci const, scegli let solo se devi riassegnare.

  • Tipi primitivi

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

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

    Usa sempre === / !==, mai == / !=.

  • Conversioni esplicite

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

Stringhe

  • Template literals

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

    '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'
  • Numeri e 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'

Array

  • Creare e accedere

    const a = [1, 2, 3];
    a[0]               // 1
    a.length           // 3
    a.push(4)          // [1,2,3,4]
    a.pop()            // rimuove e ritorna l'ultimo
    a.unshift(0); a.shift();
  • Spread e copia

    const b = [...a, 4, 5];
    const copia = [...a];
    const max = Math.max(...a);
  • Funzionali — map / filter

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

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

    [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
  • Ordinare

    // In-place (muta!)
    [3,1,2].sort((a, b) => a - b)     // [1,2,3]
    // Copia non distruttiva
    [3,1,2].toSorted((a, b) => b - a) // [3,2,1]

    sort() di default è lessicografico: passa un comparatore.

Oggetti

  • Creare e accedere

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

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

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

    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)) { /* ... */ }
  • Da/verso entries

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

Funzioni

  • Forme

    function somma(a, b) { return a + b; }
    const somma = (a, b) => a + b;
    const saluta = (nome = 'Mondo') => `Ciao, ${nome}`;
  • Rest e 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

    La funzione interna "ricorda" le variabili di quella esterna.

  • Funzioni di ordine superiore

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

Controllo del flusso

  • if / else

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

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

    for (let i = 0; i < n; i++) { /* ... */ }
    for (const v of arr) { /* valori */ }
    for (const k in obj) { /* chiavi */ }
    while (cond) { /* ... */ }
    do { /* almeno 1 volta */ } while (cond);

    for…of su array (valori); for…in su oggetti (chiavi).

  • break / continue

    for (const n of nums) {
      if (n < 0) continue;  // salta
      if (n > 100) break;   // esci
      // ...
    }
  • try / catch / finally

    try {
      const r = puoFallire();
    } catch (err) {
      console.error(err.message);
    } finally {
      // sempre, ok o ko
    }

Asincrono

  • Promise

    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 solo dentro async function (o moduli ESM con top-level await).

  • Errori asincroni

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

    Promise.all([p1, p2, p3])         // tutte ok, prima rejection esce subito
    Promise.allSettled([p1, p2, p3])  // sempre array di esiti
    Promise.race([p1, p2])            // la prima che si decide

Moduli ESM

  • 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';
eLearner.app · Corso JavaScript · cheatsheet generato dai contenuti delle lezioni.