Esempi di flashcard JavaScript dalla nostra app

Scarica la nostra app dall'App Store o da Google Play per ottenere più flashcard gratuite o abbonati per accedere a tutte le flashcard.

Cos'è l'ambito lessicale in JavaScript?

Lo scope lessicale in JavaScript è un principio in cui l'intervallo di visibilità di una variabile è determinato dalla sua posizione nel codice. Ciò significa che le variabili sono accessibili all'interno del blocco in cui sono state definite, così come in qualsiasi blocco nidificato. Questo permette la creazione di chiusure e il controllo sull'accesso alle variabili. Esempio di utilizzo dello scope lessicale nel codice JavaScript:

function outerFunction() {
  let outerVariable = `Sono fuori!`;

  function innerFunction() {
    console.log(outerVariable); // Ha accesso all' 'outerVariable'
  }

  innerFunction();
}
outerFunction(); // Mostra `Sono fuori!`

Lo scope lessicale permette a una funzione interna di accedere alle variabili definite in una funzione esterna, anche dopo che la funzione esterna è terminata. Questo è un elemento chiave nella creazione di chiusure in JavaScript, consentendo una gestione dello stato più flessibile nelle applicazioni.

Cos'è l'hoisting?

L'Hoisting è un meccanismo nei linguaggi JavaScript in cui le variabili e le funzioni vengono spostate all'inizio del loro ambito prima che il codice venga eseguito. In pratica, questo significa che possiamo utilizzare funzioni o variabili prima che vengano effettivamente dichiarate.

Tuttavia, va notato che l'hoisting funziona leggermente diversamente per le variabili e le funzioni.

Per le variabili dichiarate con la parola chiave var, solo la dichiarazione è sollevata, non l'inizializzazione. Le variabili inizializzate prima della dichiarazione saranno restituite come undefined.

Un esempio di codice di hoisting per le variabili:

console.log(myVar); // undefined
var myVar = 5;
console.log(myVar); // 5

Per le funzioni, l'hoisting sposta sia la dichiarazione che la definizione della funzione in cima, il che permette l'uso della funzione prima che venga dichiarata.

Un esempio di codice di hoisting per le funzioni:

console.log(myFunction()); // "Hello World"

function myFunction() {
  return "Hello World";
}

L'hoisting non si verifica per le variabili dichiarate con let e const.

Cos'è una funzione freccia e quali sono i suoi vantaggi?

Una funzione freccia, nota anche come funzione freccia, è un tipo di funzione introdotta in ECMAScript 6 (ES6). Vengono chiamate funzioni freccia perché utilizzano una sintassi speciale con una freccia ( => ) per definire la funzione.

Per confronto, una funzione tradizionale potrebbe avere questo aspetto:

function sum(a, b) {
  return a + b;
}

Il suo equivalente come funzione freccia è:

const sum = (a, b) => a + b;

Il principale vantaggio di una funzione freccia è che non crea un proprio contesto di esecuzione (legame con this), che è spesso una fonte di errori in JavaScript. Nelle funzioni freccia, this è ereditato dal contesto circostante. Un altro vantaggio è la brevità della sintassi, particolarmente utile quando le funzioni vengono utilizzate come argomenti per altre funzioni, ad esempio nelle funzioni di ordine superiore.

D'altra parte, a causa della mancanza del suo proprio this, le funzioni freccia non sono adatte per definire oggetti costruttori (creativi) o per creare metodi negli oggetti prototipo.

Cos'è un oggetto Promise e come può essere utilizzato?

L'oggetto Promise in JavaScript è utilizzato per gestire operazioni asincrone. Una Promise rappresenta un valore che potrebbe non essere disponibile al momento della creazione della Promise, ma potrebbe essere disponibile in futuro, o mai.

Un oggetto Promise può essere in uno dei tre stati:
1. In sospeso - l'operazione è ancora in corso, non è terminata né con successo né con errori.
2. Realizzato - l'operazione è stata completata con successo, Promise ha restituito un valore.
3. Respinto - l'operazione è stata completata con un errore, Promise ha restituito il motivo dell'errore.

Una Promise che è stata realizzata o respinta viene considerata "risolta" e il suo stato non cambia mai.

Creazione di un oggetto Promise:

const promise = new Promise((resolve, reject) => {
  const success = true;
  if (success) {
    resolve('Operazione riuscita.');
  } else {
    reject('Operazione fallita.');
  }
});

Utilizzo di un oggetto Promise:

promise
  .then(result => {
    console.log(result); // Stamperà: 'Operazione riuscita.'
  })
  .catch(error => {
    console.log(error);
  });

Il metodo .then() viene eseguito quando la Promise è realizzata, e .catch() quando è respinta. In entrambi i casi, il risultato dell'operazione o il motivo del rifiuto della Promise viene passato come argomento.

Cos'è una callback?

Una callback, anche chiamata funzione di callback, è una funzione che viene passata come argomento a un'altra funzione e viene quindi eseguita (richiamata) dopo il completamento di quella funzione. Le funzioni di callback sono comunemente utilizzate in JavaScript, in particolare nelle operazioni asincrone come le richieste AJAX o la gestione degli eventi.

Le funzioni di callback di solito ricevono i risultati di una certa operazione come argomenti, quindi possono essere utilizzate per elaborare o analizzare tali risultati.

L'uso di una tale funzione nella pratica può apparire come segue:

function executeAfterTimeout(callback, timeout) {
  setTimeout(() => {
    console.log('È passato del tempo!');
    callback();
  }, timeout);
}

executeAfterTimeout(() => {
  console.log('Questa è una callback!');
}, 2000);

In questo caso, la funzione `executeAfterTimeout` riceve una funzione di `callback` come parametro, che verrà eseguita dopo che è passato un determinato lasso di tempo. Le funzioni di callback sono estremamente utili per gestire il flusso di controllo asincrono in JavaScript.

Cos'è l'operatore di coalescenza nullish e come funziona?

L'Operatore di Coalescenza Nullish (??) è un operatore logico che restituisce il lato destro dell'operazione quando il lato sinistro è null o indefinito. In altre parole, quando una variabile è vuota, l'operatore di coalescenza nullish restituisce il valore definito come risultato.

La notazione di base è:

let value = null ?? 'default value';

In questo caso, poiché il lato sinistro (value) è null, il risultato è 'default value'. Inoltre, questo operatore si differenzia dall'operatore OR (||), poiché la funzione OR restituisce il lato destro quando il lato sinistro è falso (false, 0, '', null, undefined, NaN), mentre l'operatore di coalescenza nullish restituisce soltanto il lato destro quando il lato sinistro è null o indefinito.

Esempio con OR:

let value1 = 0 || 'default';
console.log(value1); // output: 'default' perché 0 è un valore falso

Esempio con coalescenza nullish:

let value2 = 0 ?? 'default';
console.log(value2); // output: 0 perché 0 non è null o indefinito

Quindi, a differenza di OR, l'operatore di coalescenza nullish non tratta 0, '' e NaN come valori "vuoti".

Cos'è Symbol e quando dovrebbe essere usato?

Un Simbolo in JavaScript è un tipo di dato unico e immutabile che viene spesso utilizzato per identificare proprietà uniche degli oggetti.

Puoi creare un Simbolo chiamando il costruttore Symbol(), che crea un simbolo unico ogni volta che viene chiamato. Anche se chiamiamo il costruttore Symbol() con lo stesso argomento, ogni simbolo creato sarà diverso.

const symbol1 = Symbol('mySymbol');
const symbol2 = Symbol('mySymbol');
console.log(symbol1 === symbol2); // restituisce false

Symbol viene spesso utilizzato per definire proprietà (univoche) di oggetti, specialmente quando vogliamo che questa proprietà sia nascosta o privata. Copre anche proprietà che non sono considerate quando si iterano sugli oggetti utilizzando for...in o for...of e non sono restituite dal metodo Object.keys(). Inoltre, i simboli consentono di creare proprietà "pseudo" private.

let obj = {};
let privateProperty = Symbol('private');

obj[privateProperty] = 'Questo è privato';

console.log(obj[privateProperty]); // 'Questo è privato'
console.log(Object.keys(obj)); // []

Non esiste una regola definita su quando utilizzare Symbol. Vengono tipicamente utilizzati quando vogliamo creare una proprietà unica su un oggetto che non può essere facilmente vista o modificata, oppure vogliamo definire metodi che influiscono sul comportamento degli oggetti a basso livello.

Cosa sono WeakMap e WeakSet?

WeakMap e WeakSet sono versioni speciali degli oggetti JavaScript Map e Set che non impediscono il rilascio automatico della memoria da parte del Garbage Collector.

WeakMap è una raccolta di coppie chiave-valore in cui le chiavi devono essere oggetti e i valori possono essere qualsiasi cosa. La principale differenza tra Map e WeakMap è che le chiavi in WeakMap sono tenute "debolmente", il che significa che se non ci sono altre referenze all'oggetto chiave, sarà raccolto dalla garbage collection, e la sua voce in WeakMap sarà automaticamente rimossa.

Ecco un esempio di utilizzo di WeakMap:

let john = { name: "John" };

let weakMap = new WeakMap();
weakMap.set(john, "...");

john = null; // sovrascrivi il riferimento

// john viene rimosso dalla memoria!

WeakSet è simile a ciò che WeakMap è rispetto a Map. È un insieme di oggetti, ma non impedisce la raccolta dei rifiuti se l'oggetto non è visibile da nessun'altra parte. Mancano i metodi tipici di Set come `size` e `clear`, e il metodo `add` prende solo oggetti.

Esempio di utilizzo di WeakSet:

let john = { name: "John" };

let weakSet = new WeakSet();
weakSet.add(john);

john = null; // sovrascrivi il riferimento

// john viene rimosso dalla memoria!

Entrambi, WeakMap e WeakSet, sono utilizzati principalmente in situazioni in cui vogliamo memorizzare informazioni aggiuntive sugli oggetti che dovrebbero essere rimossi quando l'oggetto stesso viene rimosso.

Flashcard di JavaScript