# javascript:void(0), cos'è?
> Cos'è e a cosa serve l'istruzione javascript:void(0), vediamolo con qualche semplice esempio
- Autore / Author: Diego Betto (https://diegobetto.com/about/)
- Pubblicato / Published: 2025-02-20
- URL: https://diegobetto.com/javascript-void-0/
- Tag: javascript, void
## Che cos'è `javascript:void(0)`?
A volte capita di trovare nel codice di una pagina **HTML** una stringa come la seguente
```html
Cliccami
```
Ma a cosa serve? In questo caso stiamo dicendo al browser che quando un utente cliccherà su quel link non dovrà accadere nulla.
A volte trovate anche questa forma
```html
Cliccami
```
Perfettamente lecita e valida ma con un piccolo rischio: lo scroll della pagina verso l'alto, verso il **top della pagina**.
Infatti solitamente possiamo usare link nella forma
```html
Cliccami
```
per far spostare lo scroll della pagina ad un elemento con `id="ancora-nella-pagina"`.
## Perchè usare JavaScript?
Se andate a leggere la documentazione ufficiale di [void su MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/void) troverete che `void` valuta l'espressione che gli passiamo e poi ritorna `undefined`.
Un browser quando trova un **URI** dentro un link nella forma `javascript:` esegue il codice e poi rimpiazza il contenuto della pagina con il valore di ritorno, **a meno che il codice o la funzione non ritornino `undefined`**.
```html
Clicca qui per non fare nulla
Clicca qui per uno sfondo verde della pagina
```
> **Evitatelo**
>
> Quella dell'esempio è una pratica ormai caduta in disuso. Evitate di usarla. Meglio utilizzare
> degli event handler ad hoc. Considerate questo come un "vecchio trucchetto".
## Utilizzi di `void` in JavaScript
Possiamo comunque utilizzare **void** per altri scopi, quelli per i quali è stato ideato.
Immaginate di aver scritto un event handler per un checkbox. Al click vogliamo che esegua una qualche operazione. Potremmo scrivere una cosa di questo tipo.
```js
checkbox.onclick = () => eseguiOperazione();
```
Al click sulla checkbox viene eseguita la funzione e poi il chekcbox cambia stato.
**MA**
Se per caso la funzione in una situazione particolare ritorna ad esempio false il flusso di azioni si interrompe e il checkbox non cambia stato.
Se è una cosa voluta non è un problema. Se però non è voluta e vogliamo evitarlo possiamo scrivere l'event handler in questa forma:
```js
checkbox.onclick = () => void eseguiOperazione();
```
Questo fa in modo che se per caso qualcuno un domani cambia quella funzione in un modo non previsto verrà in ogni caso ignorato il valore di ritorno e non bloccheremo il comportamento di default del checkbox.
Un'altro modo di utilizzare `void` è quello di eseguire una funzione e scartare subito il valore di ritorno.
```js
void (function () {
console.log("Boom!");
})();
```
## Attenzione alle precedenze
**void** risolve le espressioni con una ben definita precedenza, alla quale è bene fare attenzione per evitare risultati non voluti. Considerate questi due esempi presi sempre da MDN
```js
void 2 === "2";
void (2 === "2");
```
Quello che viene interpretato ed eseguito è quanto segue:
```js
void 2 === "2"; // returns false
void (2 === "2"); // returns undefined
```
Infatti viene eseguito il primo elemento appena dopo `void`. Nella prima riga il primo elemento è il numero 2. Nella seconda riga il primo elemento dopo **void** è il contenuto delle parentesi.
## Funzioni eseguite e poi **_PUFF_** non ci sono più
Quando usate `void` la funzione o l'espressione in generale viene eseguita e viene ritornanto `undefined`. Attenzione che l'eventuale funzione che avete utilizzato non esiste più dopo l'esecuzione.
```js
void function test() {
console.log("test function executed");
};
try {
test();
} catch (e) {
console.log("test function is not defined");
// output: "test function is not defined"
}
```
Buon coding! 😃