Słowo void oznacza „całkowicie pustą przestrzeń” według słownika. Termin ten, używany w programowaniu, odnosi się do zwrotu „niczego” – „pustej wartości”, że tak powiem.
Co oznacza słowo kluczowe void?
Gdy funkcja jest void, oznacza to, że funkcja nie zwraca nic. Jest to podobne do funkcji w JavaScript, które zwracają undefined jawnie, jak na przykład:
function und() { return undefined}und()lub niejawnie, jak na przykład:
function und() {}und()Niezależnie od wyrażeń i stwierdzeń w powyższych funkcjach (dodaje do siebie 2 liczby, znajduje średnią z 5 liczb, cokolwiek), nie ma zwracanego wyniku.
Teraz już wiemy o co chodzi ze słowem kluczowym void. A co z javascript:void(0)?
Co to jest javascript:void(0)?
Jeśli podzielimy to na części, mamy javascript: i void(0). Przyjrzyjmy się każdej z części bardziej szczegółowo.
javascript:
To jest określane jako Pseudo URL. Kiedy przeglądarka otrzymuje tę wartość jako wartość href na znaczniku zakotwiczenia, interpretuje kod JS, który następuje po dwukropku (:), zamiast traktować wartość jako ścieżkę odniesienia.
Na przykład:
<a href="javascript:console.log('javascript');alert('javascript')">Link</a>Gdy „Link” zostanie kliknięty, oto wynik:
Jak widać powyżej, przeglądarka nie traktuje href jako ścieżki referencyjnej. Zamiast tego, traktuje go jako kod JavaScript zaczynający się po „javascript:” i oddzielony średnikami.
void(0)
Operator void ocenia dane wyrażenie i zwraca undefined.
Na przykład:
const result = void(1 + 1);console.log(result);// undefined1 + 1 jest obliczane, ale undefined jest zwracane. Aby to potwierdzić, oto kolejny przykład:
<body> <h1>Heading</h1> <script> void(document.body.style.backgroundColor = 'red', document.body.style.color = 'white' ) </script></body>Wynikiem działania powyższego kodu jest:
Oto kolejny przykład:
console.log(void(0) === undefined)// truePołączenie javascript: i void(0)
Czasami nie chcesz, aby link nawigował do innej strony lub przeładowywał stronę. Używając javascript:, możesz uruchomić kod, który nie zmieni bieżącej strony.
To, użyte z void(0) oznacza, nie rób nic – nie przeładowuj, nie nawiguj, nie uruchamiaj żadnego kodu.
Na przykład:
<a href="javascript:void(0)">Link</a>Słowo „Link” jest traktowane przez przeglądarkę jako link. Na przykład, jest focusowalny, ale nie przenosi na nową stronę.
0 jest argumentem przekazywanym do void, który nic nie robi i nic nie zwraca.
Kod JavaScript (jak widać powyżej) może być również przekazywany jako argument do metody void. To sprawia, że element łącza uruchamia jakiś kod, ale zachowuje tę samą stronę.
Na przykład:
<a href="javascript:void( document.querySelector('#link').style.color = 'green')">Link</a>Gdy przycisk zostanie kliknięty, taki będzie rezultat:
Z void mówi przeglądarce, aby nic nie zwracała (lub zwraca undefined).
Innym przypadkiem użycia linków z referencją javascript:void(0) jest to, że czasami link może uruchomić jakiś kod JavaScript w tle, a nawigacja może być niepotrzebna. W tym przypadku wyrażenia byłyby użyte jako argumenty przekazywane do void.
Podsumowanie
W tym uproszczonym artykule dowiedzieliśmy się, czym jest operator void, jak działa i jak jest używany z pseudo URL-em javascript: dla href atrybutów odnośników.
To zapewnia, że strona nie przechodzi do innej strony lub przeładowuje bieżącą stronę, gdy zostanie kliknięta.