JavaScript Void 0 – Cosa significa javascript:void(0);?

La parola void significa “spazio completamente vuoto” secondo il dizionario. Questo termine, quando viene usato nella programmazione, si riferisce ad un ritorno di “niente” – un “valore vuoto” per così dire.

Che cos’è la parola chiave void?

Quando una funzione è void, significa che la funzione non restituisce nulla. Questo è simile alle funzioni in JavaScript che restituiscono undefined esplicitamente, così:

function und() { return undefined}und()

o implicitamente, così:

function und() {}und()

A prescindere dalle espressioni e dalle dichiarazioni nelle funzioni di cui sopra (aggiunge 2 numeri insieme, trova la media di 5 numeri, qualsiasi cosa), non viene restituito alcun risultato.

Ora sappiamo cosa significa la parola chiave void. Che dire di javascript:void(0)?

Cos’è javascript:void(0)?

Se dividiamo questo, abbiamo javascript: e void(0). Guardiamo ogni parte in modo più dettagliato.

javascript:

Questo viene chiamato Pseudo URL. Quando un browser riceve questo valore come valore di href su un tag di ancoraggio, interpreta il codice JS che segue i due punti (:) piuttosto che trattare il valore come un percorso di riferimento.

Per esempio:

<a href="javascript:console.log('javascript');alert('javascript')">Link</a>

Quando si clicca su “Link”, ecco il risultato:

Come visto sopra, il browser non tratta href come un percorso di riferimento. Invece, lo tratta come codice JavaScript che inizia dopo “javascript:” e separato da punti e virgola.

void(0)

L’operatore void valuta le espressioni date e restituisce undefined.

Per esempio:

const result = void(1 + 1);console.log(result);// undefined

1 + 1 viene valutato ma viene restituito undefined. Per confermarlo, ecco un altro esempio:

<body> <h1>Heading</h1> <script> void(document.body.style.backgroundColor = 'red', document.body.style.color = 'white' ) </script></body>

Il risultato del codice precedente è:

Ecco un altro esempio:

console.log(void(0) === undefined)// true

Combinazione di javascript: e void(0)

A volte, non volete che un link passi ad un’altra pagina o ricarichi una pagina. Usando javascript:, potete eseguire del codice che non cambia la pagina corrente.

Questo, usato con void(0) significa, non fare nulla – non ricaricare, non navigare, non eseguire alcun codice.

Per esempio:

<a href="javascript:void(0)">Link</a>

La parola “Link” è trattata come un link dal browser. Per esempio, è focalizzabile, ma non naviga verso una nuova pagina.

0 è un argomento passato a void che non fa nulla, e non restituisce nulla.

Il codice JavaScript (come visto sopra) può anche essere passato come argomento al metodo void. Questo fa sì che l’elemento di collegamento esegua del codice ma mantiene la stessa pagina.

Per esempio:

<a href="javascript:void( document.querySelector('#link').style.color = 'green')">Link</a>

Quando il pulsante viene cliccato, questo è il risultato:

Con void, si dice al browser di non restituire nulla (o restituire undefined).

Un altro caso d’uso dei link con il riferimento javascript:void(0) è che a volte, un link può eseguire del codice JavaScript in background, e la navigazione può essere inutile. In questo caso, le espressioni verrebbero usate come argomenti passati a void.

Conclusione

In questo articolo semplificato, abbiamo imparato cos’è l’operatore void, come funziona e come si usa con lo pseudo URL javascript: per gli attributi href dei link.

Questo assicura che una pagina non navighi verso un’altra pagina o ricarichi la pagina corrente quando viene cliccata.

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *