O ile wiem, te dwa elementy javascript zachowują się w ten sam sposób:
Opcja A:
function myTimeoutFunction()
{
doStuff();
setTimeout(myTimeoutFunction, 1000);
}
myTimeoutFunction();
Opcja B:
function myTimeoutFunction()
{
doStuff();
}
myTimeoutFunction();
setInterval(myTimeoutFunction, 1000);
Czy jest jakaś różnica między użyciem setTimeout i setInterval ?
javascript
setinterval
Damovisa
źródło
źródło
Odpowiedzi:
Zasadniczo próbują zrobić to samo, ale
setInterval
podejście będzie dokładniejsze niżsetTimeout
podejście, ponieważsetTimeout
czeka 1000 ms, uruchamia funkcję, a następnie ustawia inny limit czasu. Tak więc okres oczekiwania wynosi w rzeczywistości nieco ponad 1000 ms (lub o wiele więcej, jeśli wykonanie funkcji zajmuje dużo czasu).Chociaż można by pomyśleć, że
setInterval
będzie wykonywany dokładnie co 1000 ms, należy zauważyć, żesetInterval
również się opóźni, ponieważ JavaScript nie jest językiem wielowątkowym, co oznacza, że - jeśli działają inne części skryptu - interwał będzie miał czekać, aż to się skończy.W tym skrzypce wyraźnie widać, że limit czasu się opóźnia, podczas gdy interwał jest prawie cały czas przy prawie 1 wywołaniu na sekundę (co skrypt próbuje zrobić). Jeśli zmienisz zmienną prędkości u góry na coś małego, na przykład 20 (co oznacza, że będzie próbowała działać 50 razy na sekundę), przedział nigdy nie osiągnie średnio 50 iteracji na sekundę.
Opóźnienie jest prawie zawsze nieistotne, ale jeśli programujesz coś naprawdę precyzyjnego, powinieneś wybrać samoregulujący się licznik czasu (który w zasadzie jest licznikiem czasu, który stale dostosowuje się do tworzonego opóźnienia)
źródło
Tak. Limit czasu jest wykonywany przez określony czas po wywołaniu setTimeout (); Interwał wykonuje określony czas po wystrzeleniu poprzedniego interwału.
Zauważysz różnicę, jeśli wykonanie funkcji doStuff () zajmie trochę czasu. Na przykład, jeśli reprezentujemy wywołanie setTimeout / setInterval za pomocą
.
, uruchomienie limitu czasu / interwału*
i wykonanie kodu JavaScript za pomocą[-----]
, linie czasu wyglądają następująco:Następną komplikacją jest sytuacja, gdy interwał jest uruchamiany, gdy JavaScript jest już zajęty robieniem czegoś (np. Obsługą poprzedniego interwału). W takim przypadku interwał zostanie zapamiętany i nastąpi natychmiast po zakończeniu poprzedniej procedury obsługi i zwróceniu kontroli do przeglądarki. Na przykład dla procesu doStuff (), który jest czasami krótki ([-]), a czasem długi ([-----]):
• reprezentuje odpalanie interwału, które nie mogło od razu wykonać swojego kodu, a zamiast tego zostało oczekujące.
Interwały próbują więc „nadrobić zaległości”, aby wrócić do harmonogramu. Ale nie ustawiają się w kolejce jeden po drugim: na interwał może być tylko jedno wykonanie. (Gdyby wszystkie stały w kolejce, przeglądarka miałaby ciągle powiększającą się listę zaległych wykonań!)
x oznacza odpalenie interwału, które nie mogło zostać wykonane lub być w toku, dlatego zostało odrzucone.
Jeśli funkcja doStuff () zwykle trwa dłużej niż ustawiony dla niej interwał, przeglądarka zje 100% procesora próbującego ją obsłużyć i może stać się mniej wrażliwa.
Chained-Timeout zapewnia przeglądarce wolne miejsce w wolnym czasie; Interwał stara się zapewnić, aby działająca funkcja była wykonywana jak najbliżej zaplanowanych godzin, kosztem dostępności interfejsu użytkownika przeglądarki.
Zastanawiałbym się, czy interwał jednorazowych animacji powinien być jak najbardziej płynny, podczas gdy przerwy w łańcuchach są bardziej grzeczne w przypadku trwających animacji, które miałyby miejsce przez cały czas podczas ładowania strony. W przypadku mniej wymagających zastosowań (takich jak trywialne odpalanie aktualizacji co 30 sekund lub coś w tym rodzaju) możesz bezpiecznie użyć jednego z nich.
Pod względem zgodności z przeglądarkami setTimeout poprzedza setInterval, ale wszystkie przeglądarki, które spotkasz dzisiaj, obsługują oba. Ostatnim maruderem od wielu lat była IE Mobile w WinMo <6,5, ale mam nadzieję, że to też jest już za nami.
źródło
setInterval ()
setInterval()
jest metodą wykonania kodu opartą na interwałach czasowych, która ma natywną zdolność do wielokrotnego uruchamiania określonego skryptu po osiągnięciu tego interwału. To powinno nie być zagnieżdżone w jego funkcji zwrotnej przez autora skryptu, aby to pętla, ponieważ pętle domyślnie . Będzie strzelał z przerwą, chyba że zadzwoniszclearInterval()
.Jeśli chcesz zapętlić kod animacji lub zaznaczyć takt zegara, użyj
setInterval()
.setTimeout ()
setTimeout()
to metoda wykonania kodu oparta na czasie, która wykona skrypt tylko jeden raz, gdy zostanie osiągnięty interwał. Będzie nie powtórzyć jeszcze raz, jeśli nie dostosować go do pętli skryptu przez zagnieżdżanie sięsetTimeout()
wewnątrz obiektu funkcji wywołuje uruchomić. Jeśli jest nastawiony na pętlę, będzie strzelał z przerwą, chyba że zadzwoniszclearTimeout()
.Jeśli chcesz, aby coś się wydarzyło po upływie określonego czasu, użyj
setTimeout()
. Wynika to z tego, że wykonuje się tylko jeden raz po osiągnięciu określonego przedziału czasu.źródło
setTimeout()
przykładzie POsetTimeout()
jest wywoływany rekurencyjnie , podczas gdysetInterval()
nie jest.SetInterval ułatwia anulowanie przyszłego wykonania kodu. Jeśli używasz setTimeout, musisz śledzić identyfikator timera na wypadek, gdybyś chciał go później anulować.
przeciw
źródło
setTimeout
jest raczej niż zapisywanie id addif
instrukcji, aby ustawić następny limit czasu tylko wtedy, gdy jakiś warunek jest spełniony.doStuff
ponieważ identyfikator jest nieprawidłowy. Jednak tak naprawdę nie jest konieczne zapisywanie identyfikatorów przekroczenia limitu czasu. Zamiast tego możesz po prostu przestać dzwonićsetTimeout
.Uważam, że
setTimeout
metoda jest łatwiejsza w użyciu, jeśli chcesz anulować limit czasu:Ponadto, jeśli coś pójdzie nie tak w funkcji, przestanie się powtarzać przy pierwszym błędzie, zamiast powtarzać błąd co sekundę.
źródło
Różnica tkwi w ich celach.
To takie proste
Więcej szczegółowych informacji tutaj http://javascript.info/tutorial/settimeout-setinterval
źródło
setTimeout()
przykładzie POsetTimeout()
jest wywoływany rekurencyjnie , podczas gdysetInterval()
nie jest.Kiedy uruchomisz jakąś funkcję w setInterval, która działa dłużej niż limit czasu-> przeglądarka utknie.
- Np. DoStuff () zajmuje 1500 sekund. wykonać, a ty zrobisz: setInterval (doStuff, 1000);
1) Uruchom przeglądarkę doStuff (), co zajmuje 1,5 sekundy. być straconym;
2) Po ~ 1 sekundzie próbuje ponownie uruchomić doStuff () . Ale poprzednia funkcja doStuff () jest nadal wykonywana-> więc przeglądarka dodaje to uruchomienie do kolejki (uruchamiane po wykonaniu pierwszej).
3,4, ..) To samo dodawanie do kolejki wykonywania dla następnych iteracji, ale doStuff () z poprzednich jest nadal w toku ...
W rezultacie przeglądarka utknęła.
Aby temu zapobiec, najlepszym sposobem jest uruchomienie setTimeout wewnątrz setTimeout w celu emulacji setInterval .
Aby skorygować limity czasu między wywołaniami setTimeout, można użyć samokorekty jako alternatywy dla techniki setInterval JavaScript .
źródło
Używam setTimeout.
Najwyraźniej różnica polega na tym, że setTimeout wywołuje metodę raz, setInterval wywołuje ją wielokrotnie.
Oto dobry artykuł wyjaśniający różnicę: Samouczek: liczniki JavaScript z setTimeout i setInterval
źródło
Twój kod będzie miał różne przedziały czasowe wykonywania, a w niektórych projektach, takich jak gry online, jest to niedopuszczalne. Po pierwsze, co należy zrobić, aby kod działał z tymi samymi przedziałami, należy zmienić „myTimeoutFunction” na:
Po tej zmianie będzie ona równa
Ale nadal nie będziesz mieć stabilnego wyniku, ponieważ JS jest jednowątkowy. Na razie, jeśli wątek JS będzie zajęty czymś, nie będzie mógł wykonać funkcji wywołania zwrotnego, a wykonanie zostanie odroczone o 2-3 ms. Czy masz 60 egzekucji na sekundę i za każdym razem, gdy masz losowe opóźnienie 1-3 sekund, będzie to absolutnie niedopuszczalne (po jednej minucie będzie to około 7200 ms) i mogę doradzić, aby użyć czegoś takiego:
Ten kod gwarantuje stabilny okres realizacji. Nawet wątek będzie zajęty, a Twój kod zostanie wykonany po 1005 ms, następnym razem będzie miał limit czasu na 995 ms, a wynik będzie stabilny.
źródło
Zrobiłem prosty test
setInterval(func, milisec)
, ponieważ byłem ciekawy, co się dzieje, gdy zużycie czasu funkcji jest większe niż czas interwału.setInterval
będzie ogólnie zaplanować następną iterację tuż po starcie poprzedniej iteracji, chyba że funkcja ta jest nadal w toku . Jeśli tak,setInterval
zaczeka, aż funkcja się skończy. Jak tylko to się stanie, funkcja jest natychmiast ponownie uruchamiana - nie trzeba czekać na następną iterację zgodnie z harmonogramem (tak jak byłoby w warunkach bez funkcji przekroczenia czasu). Nie ma również sytuacji z uruchomionymi równoległymi iteracjami.Przetestowałem to na Chrome v23. Mam nadzieję, że jest to deterministyczne wdrożenie we wszystkich nowoczesnych przeglądarkach.
Dane wyjściowe konsoli:
Ta
wait
funkcja jest tylko pomocnikiem do blokowania wątków - synchroniczne wywołanie ajax, które zajmuje dokładnie 2500 milisekund przetwarzania po stronie serwera:źródło
setTimout
Preferowane jest połączenie rekurencyjne .Aby spojrzeć na to trochę inaczej: setInterval zapewnia, że kod jest uruchamiany w każdym podanym przedziale czasu (tj. 1000 ms lub ile określasz), podczas gdy setTimeout ustawia czas, w którym „czeka” do uruchomienia kodu. A ponieważ uruchomienie kodu zajmuje dodatkowe milisekundy, sumuje się do 1000 ms, a zatem setTimeout uruchamia się ponownie w niedokładnych czasach (ponad 1000 ms).
Na przykład liczniki czasu / odliczanie nie są wykonywane za pomocą setTimeout, są one wykonywane za pomocą setInterval, aby upewnić się, że nie opóźnia się, a kod działa dokładnie w danym interwale.
źródło
Zarówno setInterval, jak i setTimeout zwracają identyfikator timera, którego można użyć do anulowania wykonania, to znaczy przed uruchomieniem limitów czasu. Aby anulować, zadzwoń do clearInterval lub clearTimeout w następujący sposób:
Ponadto limity czasu są automatycznie anulowane po opuszczeniu strony lub zamknięciu okna przeglądarki.
źródło
Możesz samodzielnie sprawdzić poprawność odpowiedzi bobince po uruchomieniu następującego javascript lub sprawdzeniu tego JSFiddle
źródło
Cóż, setTimeout jest lepszy w jednej sytuacji, jak właśnie się dowiedziałem. Zawsze używam setInterval, który pozostawiłem w tle na ponad pół godziny. Kiedy wróciłem do tej zakładki, pokaz slajdów (na którym użyto kodu) zmieniał się bardzo szybko, zamiast co 5 sekund, które powinien mieć. W rzeczywistości zdarza się to ponownie, gdy testuję go bardziej i czy to wina przeglądarki, czy nie, nie jest to ważne, ponieważ dzięki setTimeout sytuacja jest całkowicie niemożliwa.
źródło
Różnica jest widoczna w konsoli:
źródło
Po prostu dodając do tego, co już zostało powiedziane, ale wersja kodu setTimeout osiągnie również ten,
Maximum call stack size
który zatrzyma jego działanie. Ponieważ nie ma podstawowego przypadku, w którym funkcja rekurencyjna mogłaby się zatrzymać, więc nie można jej uruchamiać na zawsze.źródło
setTimeout () wykona wyrażenie tylko RAZ i po upływie określonego czasu.
Jednak,
setInterval () wykona wyrażenie w INFINITE-LOOP po każdym określonym czasie trwania.
źródło
Myślę
SetInterval
iSetTimeout
są inne.SetInterval
wykonuje blok zgodnie z ustawionym czasem,SetTimeout
wykonuje blok kodu raz.Wypróbuj następujący zestaw kodów po upływie sekund odliczania limitu czasu:
a następnie spróbuj
Różnice możesz zobaczyć dla siebie.
źródło