Jak czekać lub spać wykonanie kodu w JavaScript

Spać jest funkcją obecną w większości języków programowania i służy do opóźnienia wykonywania kodu przez określony czas. JavaScript nie ma tej funkcji, więc używamy settimeout () funkcja wykonania tego samego zadania. Chociaż nie działa dokładnie tak, jak oczekujemy od funkcji snu, użyjemy go do zbudowania własnej funkcji snu w JavaScript, w tym artykule.

Na przykład, jeśli musimy zalogować trzy wiadomości do konsoli z opóźnieniem jednej sekundy, nie możemy tego zrobić za pomocą funkcji snu w JavaScript, ponieważ nie jest dostępna. Ale możemy to obejść za pomocą settimeout () funkcjonować.

Jaka jest metoda Settimeout ()?

settimeout () Metoda służy do ustawienia licznika czasu w celu opóźnienia wykonywania kodu. Wykonuje określony kawałek kodu po wygaśnięciu czasu.

Wielu deweloperów, którzy pracowali z spać() Znajdź funkcję settimeout () być mylącym. To dlatego, że mylą settimeout () funkcja jako wersja spać() Funkcja w JavaScript.

Niestety settimeout () ma swoje własne zasady i nie działa tak spać() Funkcja robi to JavaScript, które muszą wymyślić genialne rozwiązania, aby działało jako spać() funkcjonować.

W tym przewodniku przyjrzymy się kilku takich rozwiązań i wyjaśnimy, w jaki sposób możemy użyć settimeout () funkcja zatrzymania wykonywania kodu źródłowego JavaScript i czekania między kolejnymi wierszami kodu.

w przeciwieństwie do spać() funkcja, jeśli po prostu odłożymy opóźnienie jednej sekundy za pomocą settimeout () Metoda między wierszami kodu JavaScript, nie działa:

Settimeout (1000)
konsola.Log („Pokazuj po jednej sekundzie”)
Settimeout (1000)
konsola.Log („Pokazuj po kolejnej jednej sekundzie”)

Kod w powyższym przykładzie zostanie wykonany bez opóźnień, jakby settimeout () Funkcja nie istnieje.

Problem z kodem podanym powyżej polega na tym, że settimeout () Metoda opóźnia wykonywanie funkcji, która jest do niej przekazywana jako funkcja wywołania zwrotnego. Jednak daliśmy tylko jeden „opóźnienie”Argument, kiedy ma to mieć dwa różne argumenty. Pierwszym argumentem ma być funkcja wywołania zwrotnego, a drugim argumentem ma być „opóźnienie". Teraz spróbujmy to zrobić i zobaczmy, co się stanie:

settimeout (() => konsola.Log („Pokazuj po jednej sekundzie”), 1000)
settimeout (() => konsola.Log („Pokazuj po kolejnej jednej sekundzie”), 1000)

Tym razem settimeout () Funkcja będzie działać, ale nie tak, jak powinna, ponieważ oba komunikaty dziennika konsoli będą wyświetlane w tym samym czasie zamiast opóźnienia między nimi 1000 milisekund.

Dlaczego więc Settimeout () zawiodło?

Powód dlaczego settimeout () niepowodzenie w powyższym przykładzie jest to, że settimeout () Sama funkcja działa synchronicznie w kodzie JavaScript, ale funkcja połączenia w funkcji Settimeout () tworzy nowy wpis w asynchronicznej kolejce zadania, która jest wykonywana po określonym czasie.

Ponieważ określony czas w obu settimeout () Funkcja była taka sama i zostały wykonane w tym samym czasie z powodu wykonania kodu synchronicznego, jeśli JavaScript (z opóźnieniem zaledwie kilku milisekund), wszystkie wpisy w asynchronicznej kolejce zadania działają jednocześnie.

Jak widzisz, settimeout () nie jest dokładną kopią spać() funkcja, raczej po prostu ustawia kod do późniejszego wykonania. Powstaje pytanie, w jaki sposób sprawił, że działa jak spać() funkcjonować. Możemy to zrobić, używając rosnącego czasu podczas dzwonienia settimeout () funkcjonować:

settimeout (() => konsola.Log („Pokazuj po jednej sekundzie”), 1000)
settimeout (() => konsola.Log („Pokazuj po kolejnej jednej sekundzie”), 2000)

Działa to, ponieważ nowy wpis w kolejce jest tworzony w przybliżeniu w tym samym czasie, ale te wpisy muszą czekać na różne ilości czasu.

Metoda podana powyżej jest metodą stosowaną do opóźnienia wykonywania niektórych części kodu, podczas gdy inne części działają synchronicznie. Jeśli jednak chcesz zatrzymać wykonywanie całego kodu JavaScript podczas asynchronicznego wykonywania niektórych innych części, musisz stworzyć niestandardowy spać() funkcjonować.

Jak napisać funkcję snu

W JavaScript możemy stworzyć zwyczaj spać() funkcja za pomocą obietnic, asynchronizacji i oczekiwania. Działa to dokładnie jako spać() Funkcja byłaby w każdym innym języku.

Jednak ten zwyczaj spać() Funkcję musi być używana z słowem kluczowym oczekiwanym i powinna być wywoływana z funkcji asynchronicznych.

var sleep = (opóźnienie) => nowa obietnica ((rozdzielcz) => settimeout (rozdzielcz, opóźnienie))
var reverseMessage = async () =>
Czekaj na sen (1000)
konsola.Log („Pokazuj po jednej sekundzie”)
Czekaj na sen (1000)
konsola.Log („Pokazuj po kolejnej jednej sekundzie”)

ReversMessage ();

Teraz, stosując tę ​​niestandardową metodę snu, możesz zatrzymać wykonywanie kodu JavaScript na żądany czas.

Wniosek

JavaScript nie ma spać() funkcja domyślnie opóźnienie wykonywania kodu, ale jego asynchroniczny charakter można użyć do wykonania tego samego zadania. Wbudowane settimeout () Metodę można zastosować do opóźnienia wykonywania kodu, ale naprawdę sprawić, że kod jest asynchroniczny w JavaScript i sprawić, że działa jak spać() Funkcja musimy użyć funkcji obietnic, oczekiwania i asynchronizacji. W tym artykule nauczyliśmy się tworzyć zwyczaj spać() Funkcje w JavaScript.