Scheda di Riferimento JavaScript
Un riferimento ricercabile e stampabile del JavaScript moderno — sintassi, array, stringhe, oggetti, async/await, DOM e funzionalità ES2022+. Gratis.
Variabili e tipi
10let x = 1;
Variabile a blocco, riassegnabile
const PI = 3.14;
Costante a blocco
typeof value
Restituisce il tipo come stringa
Number('42')
Converte una stringa in numero
String(42)
Converte un valore in stringa
parseInt('42px', 10)
Analizza l'intero iniziale (base 10)
Boolean(0)
Forza un valore a true/false
value ?? 'default'
Coalescenza nullish (solo null/undefined)
a?.b?.c
Optional chaining, si interrompe su null
Array.isArray(x)
Verifica se un valore è un array
Funzioni
9function add(a, b) { return a + b; }
Dichiarazione di funzione con nome
const add = (a, b) => a + b;
Arrow function con return implicito
const f = (a = 1) => a;
Valore predefinito del parametro
function f(...args) {}
I rest parameter raccolgono in un array
f(...arr)
Espande un array in argomenti
const { a, b } = obj;
Destrutturazione di oggetti
const [x, y] = arr;
Destrutturazione di array
(function(){})()
Funzione invocata immediatamente (IIFE)
fn.bind(this)
Vincola un contesto this fisso
Stringhe
10`Hello ${name}`
Interpolazione con template literal
str.length
Numero di caratteri
str.includes('a')
Verifica se esiste una sottostringa
str.slice(0, 3)
Estrae parte di una stringa
str.replace(/a/g, 'b')
Sostituisce le corrispondenze (regex)
str.split(',')
Divide in un array
str.trim()
Rimuove gli spazi circostanti
str.toUpperCase()
Converte in maiuscolo
str.padStart(3, '0')
Riempie l'inizio fino a una lunghezza
str.at(-1)
Carattere all'indice (supporta i negativi)
Array
11arr.map(x => x * 2)
Trasforma ogni elemento
arr.filter(x => x > 0)
Mantiene gli elementi corrispondenti
arr.reduce((a, b) => a + b, 0)
Riduce a un singolo valore
arr.find(x => x.id === 1)
Primo elemento corrispondente
arr.some(x => x > 0)
true se almeno un elemento corrisponde
arr.every(x => x > 0)
true se tutti gli elementi corrispondono
arr.includes(3)
Verifica la presenza di un valore
arr.sort((a, b) => a - b)
Ordinamento numerico crescente
[...new Set(arr)]
Rimuove i valori duplicati
arr.flat(Infinity)
Appiattisce completamente array annidati
arr.at(-1)
Ultimo elemento (indice negativo)
Oggetti
9Object.keys(obj)
Array delle chiavi enumerabili proprie
Object.values(obj)
Array dei valori propri
Object.entries(obj)
Array di coppie [key, value]
{ ...a, ...b }
Unisce oggetti (spread)
Object.assign({}, a, b)
Copia/unisce in un target
Object.freeze(obj)
Rende un oggetto immutabile
{ [key]: value }
Nome di proprietà calcolato
obj.hasOwnProperty('x')
Verifica una proprietà propria
structuredClone(obj)
Clona in profondità un oggetto
Async e promise
9async function f() {}
Dichiara una funzione async
await fetch(url)
Attende la risoluzione di una promise
Promise.all([p1, p2])
Attende la risoluzione di tutte
Promise.allSettled([p1, p2])
Attende che tutte si concludano
Promise.race([p1, p2])
Si risolve con la prima a concludersi
new Promise((res, rej) => {})
Crea una promise manualmente
try { await f(); } catch (e) {}
Gestisce errori asincroni
setTimeout(fn, 1000)
Esegue dopo un ritardo (ms)
queueMicrotask(fn)
Pianifica un microtask
Controllo di flusso
9if (a) {} else if (b) {} else {}
Rami condizionali
a ? b : c
Espressione ternaria
switch (x) { case 1: break; }
Ramificazione multipla
for (const x of arr) {}
Itera i valori (iterabili)
for (const k in obj) {}
Itera le chiavi di un oggetto
while (cond) {}
Cicla finché una condizione è vera
arr.forEach((x, i) => {})
Esegue un callback per elemento
break / continue
Esce o salta un'iterazione del ciclo
label: for (...) { break label; }
Esce da cicli annidati
DOM ed eventi
10document.querySelector('.x')
Primo elemento corrispondente
document.querySelectorAll('.x')
Tutti gli elementi corrispondenti (NodeList)
el.addEventListener('click', fn)
Aggiunge un event listener
el.classList.toggle('active')
Attiva/disattiva una classe CSS
el.dataset.id
Legge un attributo data-id
el.textContent = 'hi'
Imposta il testo in sicurezza (senza HTML)
el.setAttribute('aria-hidden', true)
Imposta un attributo
e.preventDefault()
Annulla l'azione predefinita
el.closest('.parent')
Antenato corrispondente più vicino
document.createElement('div')
Crea un nuovo elemento
Classi e moduli
9class A extends B {}
Classe con ereditarietà
constructor() { super(); }
Inizializza e chiama la classe padre
#private = 1;
Campo privato della classe
static create() {}
Metodo statico sulla classe
get value() {}
Accessore getter
export default fn;
Export predefinito del modulo
export { a, b };
Export con nome del modulo
import x, { y } from './m.js'
Import predefinito + con nome
const m = await import('./m.js')
Import dinamico
Nessuna voce corrisponde a “:q”.
Hai bisogno di aiuto?
Hai riscontrato un problema con questo strumento? Faccelo sapere.