ΠΎΡ‚Π»ΠΎΠΆΠΈΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ скрипта javascript

Π€ΠΎΡ€ΡƒΠΌ

Π‘ΠΏΡ€Π°Π²ΠΎΡ‡Π½ΠΈΠΊ

setTimeout

Бинтаксис

АргумСнты

ОписаниС, ΠΏΡ€ΠΈΠΌΠ΅Ρ€Ρ‹

Π­Ρ‚ΠΎΡ‚ ΠΌΠ΅Ρ‚ΠΎΠ΄ выполняСт ΠΊΠΎΠ΄(ΠΈΠ»ΠΈ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ), ΡƒΠΊΠ°Π·Π°Π½Π½Ρ‹ΠΉ Π² ΠΏΠ΅Ρ€Π²ΠΎΠΌ Π°Ρ€Π³ΡƒΠΌΠ΅Π½Ρ‚Π΅, асинхронно, с Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠΎΠΉ Π² delay миллисСкунд.

Π’ ΠΎΡ‚Π»ΠΈΡ‡ΠΈΠ΅ ΠΎΡ‚ ΠΌΠ΅Ρ‚ΠΎΠ΄Π° setInterval, setTimeout выполняСт ΠΊΠΎΠ΄ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΎΠ΄ΠΈΠ½ Ρ€Π°Π·.

Π‘Π»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ Π΄Π²Π° Π²Ρ‹Π·ΠΎΠ²Π° Ρ€Π°Π±ΠΎΡ‚Π°ΡŽΡ‚ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎ:

Π’Ρ‹Π·ΠΎΠ² со строкой сущСствуСт для совмСстимости с ΠΏΡ€Π΅ΠΆΠ½ΠΈΠΌΠΈ вСрсиями javascript.

ΠšΠΎΠ½Ρ‚Π΅ΠΊΡΡ‚ выполнСния, this

МоТно ΡƒΠΊΠ°Π·Π°Ρ‚ΡŒ this явно, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ ΠΏΡ€ΠΎΠΌΠ΅ΠΆΡƒΡ‚ΠΎΡ‡Π½ΡƒΡŽ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ.

Как ΠΏΡ€Π°Π²ΠΈΠ»ΠΎ, this ΠΏΠ΅Ρ€Π΅Π΄Π°Π΅Ρ‚cя Ρ‡Π΅Ρ€Π΅Π· Π·Π°ΠΌΡ‹ΠΊΠ°Π½ΠΈΠ΅. Для этого ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ промСТуточная пСрСмСнная Π²ΠΎ внСшнСй Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ присваиваСтся this :

ΠžΡ‚ΠΌΠ΅Π½Π° выполнСния

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΎΡ‚ΠΌΠ΅Π½ΠΈΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ setTimeout ΠΏΡ€ΠΈ ΠΏΠΎΠΌΠΎΡ‰ΠΈ clearTimeout, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ для этого ΠΈΠ΄Π΅Π½Ρ‚ΠΈΡ„ΠΈΠΊΠ°Ρ‚ΠΎΡ€ Ρ‚Π°ΠΉΠΌΠ°ΡƒΡ‚Π°.

Минимальная Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠ°

ΠŸΡ€ΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΡΡ‚ΡŒ

Π‘ΠΎΠ»ΡŒΡˆΠΎΠ΅ количСство Ρ‚Π°ΠΉΠΌΠ΅Ρ€ΠΎΠ² ΠΌΠΎΠΆΠ΅Ρ‚ привСсти ΠΊ ΡΠ΅Ρ€ΡŒΠ΅Π·Π½ΠΎΠΉ Π½Π°Π³Ρ€ΡƒΠ·ΠΊΠ΅ Π½Π° процСссор.

Π­Ρ‚ΠΎ Π² ΠΏΠ΅Ρ€Π²ΡƒΡŽ ΠΎΡ‡Π΅Ρ€Π΅Π΄ΡŒ касаСтся ΠΏΡ€ΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΉ, Π² ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… ΠΎΠ΄Π½ΠΎΠ²Ρ€Π΅ΠΌΠ΅Π½Π½ΠΎ анимируСтся большоС количСство ΠΎΠ±ΡŠΠ΅ΠΊΡ‚ΠΎΠ². Π’ этом случаС, ΠΏΠΎ возмоТности, слСдуСт ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΎΠ΄ΠΈΠ½ Ρ‚Π°ΠΉΠΌΠ΅Ρ€, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ выполняСт всю Π°Π½ΠΈΠΌΠ°Ρ†ΠΈΡŽ, Π° Π½Π΅ мноТСство нСзависимых.

Π‘ΠΌ. Ρ‚Π°ΠΊΠΆΠ΅

Илья, Бпасибо.
Π•Π²Π³Π΅Π½ΠΈΠΉ.

Для ΠΏΠ΅Ρ€Π΅Π΄Π°Ρ‡ΠΈ контСкста ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ΡΡ Π»ΠΈΠ±ΠΎ call/apply, Π»ΠΈΠ±ΠΎ промСТуточная пСрСмСнная Π² самой Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ, которая Π·Π°Ρ€Π°Π½Π΅Π΅ ставится Π² Π½ΡƒΠΆΠ½ΠΎΠ΅ Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅.

Π—Π° clearTimeout() ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½ΠΎΠ΅ спасибо!

А ΠΊΠ°ΠΊ ΠΏΠ΅Ρ€Π΅Π΄Π°Ρ‚ΡŒ ΠΎΠ±ΡŠΠ΅ΠΊΡ‚?

Если Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ Π½ΡƒΠΆΠ½ΠΎ Π΄Π΅Π»Π°Ρ‚ΡŒ Π΄ΠΎ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½Ρ‹Ρ… ΠΏΠΎΡ€, Ρ‚ΠΎΠ³Π΄Π° прописываСм всС Π² ΠΎΠ΄Π½ΠΎΠΉ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ ΠΈ Π½Π΅ паримся. Π’Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ ΠΈΡ‚Π΅Ρ€Π°Ρ†ΠΈΠΉ происходит ΠΏΠΎΡΠ»Π΅Π΄ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎ с ΠΏΡ€ΠΎΠΌΠ΅ΠΆΡƒΡ‚ΠΊΠΎΠΌ Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ 60 микросСкунд. + Ρ€Π΅Π°Π»ΠΈΠ·ΠΎΠ²Π°Π½Π° ΠΏΠ΅Ρ€Π΅Π΄Π°Ρ‡Π° ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Π° ΠΎΡ‚ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ Π΅Ρ‘ ΠΏΡ€Π΅Π΅ΠΌΠ½ΠΈΡ†Π΅.

1. НС ΠΌΠΈΠΊΡ€ΠΎ, Π° миллисСкунд.
2. Π­Ρ‚ΠΎΡ‚ ΠΊΠΎΠ΄ Π±ΡƒΠ΄Π΅Ρ‚ Π³Π΅Π½Π΅Ρ€ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ 25-30 Ρ‚Π°ΠΉΠΌΠ΅Ρ€ΠΎΠ² Π² сСкунду Π½Π΅ очищая ΠΈΡ…, вмСсто Ρ‚ΠΎΠ³ΠΎ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ всСго-лишь 1 ΠΎΠ±ΡŠΠ΅ΠΊΡ‚ setInterval, Ρ‰Π΅Π»ΠΊΠ°ΡŽΡ‰ΠΈΠΉ Ρ‡Π΅Ρ€Π΅Π· Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΡ‹Π΅ Π²Π°ΠΌ 60 мс ΠΈ Π²Ρ‹ΠΏΠΎΠ»Π½ΡΡŽΡ‰ΠΈΠΉ Π½ΡƒΠΆΠ½Ρ‹Π΅ ΠΏΡ€ΠΎΠ²Π΅Ρ€ΠΊΠΈ. Или Π² Ρ‡Π΅ΠΌ ΡΡƒΡ‚ΡŒ Ρ‚ΠΎ Π±Ρ‹Π»Π°?

Π’Π΅ΡΡŒΠΌΠ° ΠΆΠ΅Π»Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎ Π·Π°ΠΏΠΎΠΌΠΈΠ½Π°Ρ‚ΡŒ всС ΠΈΠ΄Π΅Π½Ρ‚ΠΈΡ„ΠΈΠΊΠ°Ρ‚ΠΎΡ€Ρ‹ Ρ‚Π°ΠΉΠΌΠ°ΡƒΡ‚ΠΎΠ², ΠΈ послС ΠΈΡ… срабатывания Π²Ρ‹Π·Ρ‹Π²Π°Ρ‚ΡŒ clearTimeout, ΠΈΠ½Π°Ρ‡Π΅, послС срабатывания большого количСства Ρ‚Π°ΠΉΠΌΠ°ΡƒΡ‚ΠΎΠ² (

Π Π°Π½ΠΎ ΠΈΠ»ΠΈ ΠΏΠΎΠ·Π΄Π½ΠΎ ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΠΎΠ½Π°Π΄ΠΎΠ±ΠΈΡ‚ΡŒΡΡ ΠΏΠ΅Ρ€Π΅Π΄Π°Π²Π°Ρ‚ΡŒ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ Π² Ρ‚Ρƒ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ, которая вызываСтся Ρ‡Π΅Ρ€Π΅Π· ΡƒΠΊΠ°Π·Π°Π½Π½Ρ‹ΠΉ ΠΏΠ΅Ρ€ΠΈΠΎΠ΄ Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ. ДСлаСтся это ΠΎΡ‡Π΅Π½ΡŒ просто, всС ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ ΡƒΠΊΠ°Π·Ρ‹Π²Π°ΡŽΡ‚ΡΡ послС миллисСкунд ΠΈ Π½Π΅ Π½ΡƒΠΆΠ½ΠΎ ΠΏΠΈΡΠ°Ρ‚ΡŒ Π³Ρ€ΠΎΠΌΠΎΠ·Π΄ΠΊΡƒΡŽ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ:

Π’Π°ΠΊΠΎΠΉ синтаксис Π±ΡƒΠ΄Π΅Ρ‚ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π² Firefox

Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ Π΄Π°ΠΆΠ΅ Π² IE7-8

ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½Π΅Π΅ Π±ΡƒΠ΄Π΅Ρ‚ setInterval(function(), 1000);

Π˜ΡΡ‚ΠΎΡ‡Π½ΠΈΠΊ

ΠŸΠ»Π°Π½ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅: setTimeout ΠΈ setInterval

ΠœΡ‹ ΠΌΠΎΠΆΠ΅ΠΌ Π²Ρ‹Π·Π²Π°Ρ‚ΡŒ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ Π½Π΅ Π² Π΄Π°Π½Π½Ρ‹ΠΉ ΠΌΠΎΠΌΠ΅Π½Ρ‚, Π° ΠΏΠΎΠ·ΠΆΠ΅, Ρ‡Π΅Ρ€Π΅Π· Π·Π°Π΄Π°Π½Π½Ρ‹ΠΉ ΠΈΠ½Ρ‚Π΅Ρ€Π²Π°Π» Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ. Π­Ρ‚ΠΎ называСтся Β«ΠΏΠ»Π°Π½ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ Π²Ρ‹Π·ΠΎΠ²Π°Β».

Для этого ΡΡƒΡ‰Π΅ΡΡ‚Π²ΡƒΡŽΡ‚ Π΄Π²Π° ΠΌΠ΅Ρ‚ΠΎΠ΄Π°:

Π­Ρ‚ΠΈ ΠΌΠ΅Ρ‚ΠΎΠ΄Ρ‹ Π½Π΅ ΡΠ²Π»ΡΡŽΡ‚ΡΡ Ρ‡Π°ΡΡ‚ΡŒΡŽ спСцификации JavaScript. Но Π±ΠΎΠ»ΡŒΡˆΠΈΠ½ΡΡ‚Π²ΠΎ срСд выполнСния JS-ΠΊΠΎΠ΄Π° ΠΈΠΌΠ΅ΡŽΡ‚ Π²Π½ΡƒΡ‚Ρ€Π΅Π½Π½ΠΈΠΉ ΠΏΠ»Π°Π½ΠΈΡ€ΠΎΠ²Ρ‰ΠΈΠΊ ΠΈ ΠΏΡ€Π΅Π΄ΠΎΡΡ‚Π°Π²Π»ΡΡŽΡ‚ доступ ΠΊ этим ΠΌΠ΅Ρ‚ΠΎΠ΄Π°ΠΌ. Π’ частности, ΠΎΠ½ΠΈ ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°ΡŽΡ‚ΡΡ Π²ΠΎ всСх Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π°Ρ… ΠΈ Node.js.

setTimeout

НапримСр, Π΄Π°Π½Π½Ρ‹ΠΉ ΠΊΠΎΠ΄ Π²Ρ‹Π·Ρ‹Π²Π°Π΅Ρ‚ sayHi() спустя ΠΎΠ΄Π½Ρƒ сСкунду:

Если ΠΏΠ΅Ρ€Π²Ρ‹ΠΉ Π°Ρ€Π³ΡƒΠΌΠ΅Π½Ρ‚ являСтся строкой, Ρ‚ΠΎ JavaScript создаст ΠΈΠ· Π½Π΅Ρ‘ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ.

Π­Ρ‚ΠΎ Ρ‚Π°ΠΊΠΆΠ΅ Π±ΡƒΠ΄Π΅Ρ‚ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ:

Но использованиС строк Π½Π΅ рСкомСндуСтся. ВмСсто этого ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ. НапримСр, Ρ‚Π°ΠΊ:

ΠΠ°Ρ‡ΠΈΠ½Π°ΡŽΡ‰ΠΈΠ΅ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠΈ ΠΈΠ½ΠΎΠ³Π΄Π° ΠΎΡˆΠΈΠ±Π°ΡŽΡ‚ΡΡ, добавляя скобки () послС Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ:

ΠžΡ‚ΠΌΠ΅Π½Π° Ρ‡Π΅Ρ€Π΅Π· clearTimeout

Бинтаксис для ΠΎΡ‚ΠΌΠ΅Π½Ρ‹:

Π’ ΠΊΠΎΠ΄Π΅ Π½ΠΈΠΆΠ΅ ΠΏΠ»Π°Π½ΠΈΡ€ΡƒΠ΅ΠΌ Π²Ρ‹Π·ΠΎΠ² Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ ΠΈ Π·Π°Ρ‚Π΅ΠΌ отмСняСм Π΅Π³ΠΎ (просто ΠΏΠ΅Ρ€Π΅Π΄ΡƒΠΌΠ°Π»ΠΈ). Π’ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚Π΅ Π½ΠΈΡ‡Π΅Π³ΠΎ Π½Π΅ происходит:

ΠŸΠΎΠ²Ρ‚ΠΎΡ€ΡŽΡΡŒ, Ρ‡Ρ‚ΠΎ Π½Π΅Ρ‚ Π΅Π΄ΠΈΠ½ΠΎΠΉ спСцификации Π½Π° эти ΠΌΠ΅Ρ‚ΠΎΠ΄Ρ‹, поэтому Ρ‚Π°ΠΊΠΎΠ΅ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΠ΅ являСтся Π½ΠΎΡ€ΠΌΠ°Π»ΡŒΠ½Ρ‹ΠΌ.

Для Π±Ρ€Π°ΡƒΠ·Π΅Ρ€ΠΎΠ² Ρ‚Π°ΠΉΠΌΠ΅Ρ€Ρ‹ описаны Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ Ρ‚Π°ΠΉΠΌΠ΅Ρ€ΠΎΠ² стандарта HTML5.

setInterval

ΠœΠ΅Ρ‚ΠΎΠ΄ setInterval ΠΈΠΌΠ΅Π΅Ρ‚ Ρ‚Π°ΠΊΠΎΠΉ ΠΆΠ΅ синтаксис ΠΊΠ°ΠΊ setTimeout :

ВсС Π°Ρ€Π³ΡƒΠΌΠ΅Π½Ρ‚Ρ‹ ΠΈΠΌΠ΅ΡŽΡ‚ Ρ‚Π°ΠΊΠΎΠ΅ ΠΆΠ΅ Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅. Но ΠΎΡ‚Π»ΠΈΡ‡ΠΈΠ΅ этого ΠΌΠ΅Ρ‚ΠΎΠ΄Π° ΠΎΡ‚ setTimeout Π² Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎ функция запускаСтся Π½Π΅ ΠΎΠ΄ΠΈΠ½ Ρ€Π°Π·, Π° пСриодичСски Ρ‡Π΅Ρ€Π΅Π· ΡƒΠΊΠ°Π·Π°Π½Π½Ρ‹ΠΉ ΠΈΠ½Ρ‚Π΅Ρ€Π²Π°Π» Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ.

Π‘Π»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΉ ΠΏΡ€ΠΈΠΌΠ΅Ρ€ Π²Ρ‹Π²ΠΎΠ΄ΠΈΡ‚ сообщСниС ΠΊΠ°ΠΆΠ΄Ρ‹Π΅ 2 сСкунды. Π§Π΅Ρ€Π΅Π· 5 сСкунд Π²Ρ‹Π²ΠΎΠ΄ прСкращаСтся:

Π’Π°ΠΊ Ρ‡Ρ‚ΠΎ Ссли Π²Ρ‹ запуститС ΠΊΠΎΠ΄ Π²Ρ‹ΡˆΠ΅ ΠΈ ΠΏΠΎΠ΄ΠΎΠΆΠ΄Ρ‘Ρ‚Π΅ с Π·Π°ΠΊΡ€Ρ‹Ρ‚ΠΈΠ΅ΠΌ alert нСсколько сСкунд, Ρ‚ΠΎ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΉ alert Π±ΡƒΠ΄Π΅Ρ‚ ΠΏΠΎΠΊΠ°Π·Π°Π½ сразу, ΠΊΠ°ΠΊ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π²Ρ‹ Π·Π°ΠΊΡ€ΠΎΠ΅Ρ‚Π΅ ΠΏΡ€Π΅Π΄Ρ‹Π΄ΡƒΡ‰ΠΈΠΉ. Π˜Π½Ρ‚Π΅Ρ€Π²Π°Π» Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ ΠΌΠ΅ΠΆΠ΄Ρƒ сообщСниями alert Π±ΡƒΠ΄Π΅Ρ‚ ΠΊΠΎΡ€ΠΎΡ‡Π΅, Ρ‡Π΅ΠΌ 2 сСкунды.

РСкурсивный setTimeout

Π•ΡΡ‚ΡŒ Π΄Π²Π° способа Π·Π°ΠΏΡƒΡΠΊΠ°Ρ‚ΡŒ Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ рСгулярно.

НапримСр, Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎ Π½Π°ΠΏΠΈΡΠ°Ρ‚ΡŒ сСрвис, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ отправляСт запрос для получСния Π΄Π°Π½Π½Ρ‹Ρ… Π½Π° сСрвСр ΠΊΠ°ΠΆΠ΄Ρ‹Π΅ 5 сСкунд, Π½ΠΎ Ссли сСрвСр ΠΏΠ΅Ρ€Π΅Π³Ρ€ΡƒΠΆΠ΅Π½, Ρ‚ΠΎ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎ ΡƒΠ²Π΅Π»ΠΈΡ‡ΠΈΡ‚ΡŒ ΠΈΠ½Ρ‚Π΅Ρ€Π²Π°Π» запросов Π΄ΠΎ 10, 20, 40 сСкунд… Π’ΠΎΡ‚ псСвдокод:

А Ссли Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΌΡ‹ ΠΏΠ»Π°Π½ΠΈΡ€ΡƒΠ΅ΠΌ, рСсурсоёмкиС ΠΈ Ρ‚Ρ€Π΅Π±ΡƒΡŽΡ‚ Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ, Ρ‚ΠΎ ΠΌΡ‹ ΠΌΠΎΠΆΠ΅ΠΌ ΠΈΠ·ΠΌΠ΅Ρ€ΠΈΡ‚ΡŒ врСмя, Π·Π°Ρ‚Ρ€Π°Ρ‡Π΅Π½Π½ΠΎΠ΅ Π½Π° Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅, ΠΈ ΡΠΏΠ»Π°Π½ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΉ Π²Ρ‹Π·ΠΎΠ² Ρ€Π°Π½ΡŒΡˆΠ΅ ΠΈΠ»ΠΈ ΠΏΠΎΠ·ΠΆΠ΅.

Π‘Ρ€Π°Π²Π½ΠΈΠΌ Π΄Π²Π° Ρ„Ρ€Π°Π³ΠΌΠ΅Π½Ρ‚Π° ΠΊΠΎΠ΄Π°. ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ setInterval :

Π’Ρ‚ΠΎΡ€ΠΎΠΉ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ рСкурсивный setTimeout :

Для setInterval Π²Π½ΡƒΡ‚Ρ€Π΅Π½Π½ΠΈΠΉ ΠΏΠ»Π°Π½ΠΈΡ€ΠΎΠ²Ρ‰ΠΈΠΊ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹ΠΏΠΎΠ»Π½ΡΡ‚ΡŒ func(i) ΠΊΠ°ΠΆΠ΄Ρ‹Π΅ 100 мс:

РСальная Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠ° ΠΌΠ΅ΠΆΠ΄Ρƒ Π²Ρ‹Π·ΠΎΠ²Π°ΠΌΠΈ func с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ setInterval мСньшС, Ρ‡Π΅ΠΌ ΡƒΠΊΠ°Π·Π°Π½ΠΎ Π² ΠΊΠΎΠ΄Π΅!

Π’ΠΏΠΎΠ»Π½Π΅ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, Ρ‡Ρ‚ΠΎ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ func Π±ΡƒΠ΄Π΅Ρ‚ дольшС, Ρ‡Π΅ΠΌ ΠΌΡ‹ ΠΎΠΆΠΈΠ΄Π°Π»ΠΈ, ΠΈ Π·Π°ΠΉΠΌΡ‘Ρ‚ Π±ΠΎΠ»Π΅Π΅ 100 мс.

Π’ Π΄Π°Π½Π½ΠΎΠΌ случаС Π΄Π²ΠΈΠΆΠΎΠΊ ΠΆΠ΄Ρ‘Ρ‚ окончания выполнСния func ΠΈ Π·Π°Ρ‚Π΅ΠΌ провСряСт ΠΏΠ»Π°Π½ΠΈΡ€ΠΎΠ²Ρ‰ΠΈΠΊ ΠΈ, Ссли врСмя истСкло, Π½Π΅ΠΌΠ΅Π΄Π»Π΅Π½Π½ΠΎ запускаСт Π΅Π³ΠΎ снова.

НиТС прСдставлСно ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅, ΠΏΠΎΠΊΠ°Π·Ρ‹Π²Π°ΡŽΡ‰Π΅Π΅ процСсс Ρ€Π°Π±ΠΎΡ‚Ρ‹ рСкурсивного setTimeout :

РСкурсивный setTimeout Π³Π°Ρ€Π°Π½Ρ‚ΠΈΡ€ΡƒΠ΅Ρ‚ Ρ„ΠΈΠΊΡΠΈΡ€ΠΎΠ²Π°Π½Π½ΡƒΡŽ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΡƒ (здСсь 100 мс).

Π­Ρ‚ΠΎ ΠΏΠΎΡ‚ΠΎΠΌΡƒ, Ρ‡Ρ‚ΠΎ Π½ΠΎΠ²Ρ‹ΠΉ Π²Ρ‹Π·ΠΎΠ² планируСтся Π² ΠΊΠΎΠ½Ρ†Π΅ ΠΏΡ€Π΅Π΄Ρ‹Π΄ΡƒΡ‰Π΅Π³ΠΎ.

Π•ΡΡ‚ΡŒ ΠΈ ΠΏΠΎΠ±ΠΎΡ‡Π½Ρ‹ΠΉ эффСкт. Ѐункция ссылаСтся Π½Π° внСшнСС лСксичСскоС ΠΎΠΊΡ€ΡƒΠΆΠ΅Π½ΠΈΠ΅, поэтому ΠΏΠΎΠΊΠ° ΠΎΠ½Π° сущСствуСт, внСшниС ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Π½Π½Ρ‹Π΅ ΡΡƒΡ‰Π΅ΡΡ‚Π²ΡƒΡŽΡ‚ Ρ‚ΠΎΠΆΠ΅. Они ΠΌΠΎΠ³ΡƒΡ‚ Π·Π°Π½ΠΈΠΌΠ°Ρ‚ΡŒ большС памяти, Ρ‡Π΅ΠΌ сама функция. ΠŸΠΎΡΡ‚ΠΎΠΌΡƒ, Ссли рСгулярный Π²Ρ‹Π·ΠΎΠ² Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ большС Π½Π΅ Π½ΡƒΠΆΠ΅Π½, Ρ‚ΠΎ Π»ΡƒΡ‡ΡˆΠ΅ ΠΎΡ‚ΠΌΠ΅Π½ΠΈΡ‚ΡŒ Π΅Π³ΠΎ, Π΄Π°ΠΆΠ΅ Ссли функция ΠΎΡ‡Π΅Π½ΡŒ малСнькая.

setTimeout с Π½ΡƒΠ»Π΅Π²ΠΎΠΉ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠΎΠΉ

Π­Ρ‚ΠΎ ΠΏΠ»Π°Π½ΠΈΡ€ΡƒΠ΅Ρ‚ Π²Ρ‹Π·ΠΎΠ² func Π½Π°ΡΡ‚ΠΎΠ»ΡŒΠΊΠΎ быстро, насколько это Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ. Но ΠΏΠ»Π°Π½ΠΈΡ€ΠΎΠ²Ρ‰ΠΈΠΊ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹Π·Ρ‹Π²Π°Ρ‚ΡŒ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ послС Π·Π°Π²Π΅Ρ€ΡˆΠ΅Π½ΠΈΡ выполнСния Ρ‚Π΅ΠΊΡƒΡ‰Π΅Π³ΠΎ ΠΊΠΎΠ΄Π°.

Π’Π°ΠΊ Π²Ρ‹Π·ΠΎΠ² Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ Π±ΡƒΠ΄Π΅Ρ‚ Π·Π°ΠΏΠ»Π°Π½ΠΈΡ€ΠΎΠ²Π°Π½ сразу послС выполнСния Ρ‚Π΅ΠΊΡƒΡ‰Π΅Π³ΠΎ ΠΊΠΎΠ΄Π°.

НапримСр, этот ΠΊΠΎΠ΄ Π²Ρ‹Π²ΠΎΠ΄ΠΈΡ‚ Β«ΠŸΡ€ΠΈΠ²Π΅Ρ‚Β» ΠΈ Π·Π°Ρ‚Π΅ΠΌ сразу Β«ΠœΠΈΡ€Β»:

ΠŸΠ΅Ρ€Π²Π°Ρ строка ΠΏΠΎΠΌΠ΅Ρ‰Π°Π΅Ρ‚ Π²Ρ‹Π·ΠΎΠ² Π² Β«ΠΊΠ°Π»Π΅Π½Π΄Π°Ρ€ΡŒΒ» Ρ‡Π΅Ρ€Π΅Π· 0 мс. Но ΠΏΠ»Π°Π½ΠΈΡ€ΠΎΠ²Ρ‰ΠΈΠΊ ΠΏΡ€ΠΎΠ²Π΅Ρ€ΠΈΡ‚ Β«ΠΊΠ°Π»Π΅Π½Π΄Π°Ρ€ΡŒΒ» Ρ‚ΠΎΠ»ΡŒΠΊΠΎ послС Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Ρ‚Π΅ΠΊΡƒΡ‰ΠΈΠΉ ΠΊΠΎΠ΄ Π·Π°Π²Π΅Ρ€ΡˆΠΈΡ‚ΡΡ. ΠŸΠΎΡΡ‚ΠΎΠΌΡƒ «ΠŸΡ€ΠΈΠ²Π΅Ρ‚» выводится ΠΏΠ΅Ρ€Π²Ρ‹ΠΌ, Π° «ΠœΠΈΡ€» – послС Π½Π΅Π³ΠΎ.

Π•ΡΡ‚ΡŒ ΠΈ Π±ΠΎΠ»Π΅Π΅ ΠΏΡ€ΠΎΠ΄Π²ΠΈΠ½ΡƒΡ‚Ρ‹Π΅ случаи использования Π½ΡƒΠ»Π΅Π²ΠΎΠΉ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠΈ Π² Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π°Ρ…, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΌΡ‹ рассмотрим Π² Π³Π»Π°Π²Π΅ Π‘ΠΎΠ±Ρ‹Ρ‚ΠΈΠΉΠ½Ρ‹ΠΉ Ρ†ΠΈΠΊΠ»: ΠΌΠΈΠΊΡ€ΠΎΠ·Π°Π΄Π°Ρ‡ΠΈ ΠΈ ΠΌΠ°ΠΊΡ€ΠΎΠ·Π°Π΄Π°Ρ‡ΠΈ.

Π’ Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π΅ Π΅ΡΡ‚ΡŒ ΠΎΠ³Ρ€Π°Π½ΠΈΡ‡Π΅Π½ΠΈΠ΅ Π½Π° Ρ‚ΠΎ, ΠΊΠ°ΠΊ часто Π²Π½ΡƒΡ‚Ρ€Π΅Π½Π½ΠΈΠ΅ счётчики ΠΌΠΎΠ³ΡƒΡ‚ Π²Ρ‹ΠΏΠΎΠ»Π½ΡΡ‚ΡŒΡΡ. Π’ стандартС HTML5 говорится: «послС пяти Π²Π»ΠΎΠΆΠ΅Π½Π½Ρ‹Ρ… Ρ‚Π°ΠΉΠΌΠ΅Ρ€ΠΎΠ² ΠΈΠ½Ρ‚Π΅Ρ€Π²Π°Π» Π΄ΠΎΠ»ΠΆΠ΅Π½ ΡΠΎΡΡ‚Π°Π²Π»ΡΡ‚ΡŒ Π½Π΅ ΠΌΠ΅Π½Π΅Π΅ Ρ‡Π΅Ρ‚Ρ‹Ρ€Ρ‘Ρ… миллисСкунд.Β».

АналогичноС происходит ΠΏΡ€ΠΈ использовании setInterval вмСсто setTimeout : setInterval(f) запускаСт f нСсколько Ρ€Π°Π· с Π½ΡƒΠ»Π΅Π²ΠΎΠΉ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠΎΠΉ, Π° Π·Π°Ρ‚Π΅ΠΌ с Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠΎΠΉ 4+ мс.

Π­Ρ‚ΠΎ ΠΎΠ³Ρ€Π°Π½ΠΈΡ‡Π΅Π½ΠΈΠ΅ сущСствуСт Π΄Π°Π²Π½ΠΎ, ΠΌΠ½ΠΎΠ³ΠΈΠ΅ скрипты ΠΏΠΎΠ»Π°Π³Π°ΡŽΡ‚ΡΡ Π½Π° Π½Π΅Π³ΠΎ, поэтому ΠΎΠ½ΠΎ сохраняСтся ΠΏΠΎ историчСским ΠΏΡ€ΠΈΡ‡ΠΈΠ½Π°ΠΌ.

Π­Ρ‚ΠΎΠ³ΠΎ ограничСния Π½Π΅Ρ‚ Π² сСрвСрном JavaScript. Π’Π°ΠΌ Π΅ΡΡ‚ΡŒ ΠΈ Π΄Ρ€ΡƒΠ³ΠΈΠ΅ способы планирования асинхронных Π·Π°Π΄Π°Ρ‡. НапримСр, setImmediate для Node.js. Π’Π°ΠΊ Ρ‡Ρ‚ΠΎ это ΠΎΠ³Ρ€Π°Π½ΠΈΡ‡Π΅Π½ΠΈΠ΅ относится Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΊ Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π°ΠΌ.

Π˜Ρ‚ΠΎΠ³ΠΎ

ΠžΠ±Ρ€Π°Ρ‚ΠΈΠΌ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, Ρ‡Ρ‚ΠΎ всС ΠΌΠ΅Ρ‚ΠΎΠ΄Ρ‹ планирования Π½Π΅ Π³Π°Ρ€Π°Π½Ρ‚ΠΈΡ€ΡƒΡŽΡ‚ Ρ‚ΠΎΡ‡Π½ΡƒΡŽ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΡƒ.

НапримСр, Ρ‚Π°ΠΉΠΌΠ΅Ρ€ Π² Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π΅ ΠΌΠΎΠΆΠ΅Ρ‚ Π·Π°ΠΌΠ΅Π΄Π»ΡΡ‚ΡŒΡΡ ΠΏΠΎ ΠΌΠ½ΠΎΠ³ΠΈΠΌ ΠΏΡ€ΠΈΡ‡ΠΈΠ½Π°ΠΌ:

Всё это ΠΌΠΎΠΆΠ΅Ρ‚ ΡƒΠ²Π΅Π»ΠΈΡ‡ΠΈΠ²Π°Ρ‚ΡŒ ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΡŒΠ½Ρ‹ΠΉ ΠΈΠ½Ρ‚Π΅Ρ€Π²Π°Π» срабатывания Ρ‚Π°ΠΉΠΌΠ΅Ρ€Π° (ΠΈ ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΡŒΠ½ΡƒΡŽ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΡƒ) Π΄ΠΎ 300 ΠΈΠ»ΠΈ Π΄Π°ΠΆΠ΅ 1000 мс Π² зависимости ΠΎΡ‚ Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π° ΠΈ настроСк ΠΏΡ€ΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΡΡ‚ΠΈ ОБ.

Π—Π°Π΄Π°Ρ‡ΠΈ

Π’Ρ‹Π²ΠΎΠ΄ ΠΊΠ°ΠΆΠ΄ΡƒΡŽ сСкунду

Π‘Π΄Π΅Π»Π°ΠΉΡ‚Π΅ Π΄Π²Π° Π²Π°Ρ€ΠΈΠ°Π½Ρ‚Π° Ρ€Π΅ΡˆΠ΅Π½ΠΈΡ.

Π˜ΡΡ‚ΠΎΡ‡Π½ΠΈΠΊ

О Ρ‚ΠΎΠΌ, ΠΊΠ°ΠΊ Ρ€Π°Π±ΠΎΡ‚Π°ΡŽΡ‚ JavaScript Ρ‚Π°ΠΉΠΌΠ΅Ρ€Ρ‹

ΠΎΡ‚Π»ΠΎΠΆΠΈΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ скрипта javascript. image loader. ΠΎΡ‚Π»ΠΎΠΆΠΈΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ скрипта javascript Ρ„ΠΎΡ‚ΠΎ. ΠΎΡ‚Π»ΠΎΠΆΠΈΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ скрипта javascript-image loader. ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠ° ΠΎΡ‚Π»ΠΎΠΆΠΈΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ скрипта javascript. ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠ° image loader. Π­Ρ‚ΠΎΡ‚ ΠΌΠ΅Ρ‚ΠΎΠ΄ выполняСт ΠΊΠΎΠ΄(ΠΈΠ»ΠΈ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ), ΡƒΠΊΠ°Π·Π°Π½Π½Ρ‹ΠΉ Π² ΠΏΠ΅Ρ€Π²ΠΎΠΌ Π°Ρ€Π³ΡƒΠΌΠ΅Π½Ρ‚Π΅, асинхронно, с Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠΎΠΉ Π² delay миллисСкунд.

На этом рисункС довольно ΠΌΠ½ΠΎΠ³ΠΎ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΠΈ, ΠΊΠΎΡ‚ΠΎΡ€ΡƒΡŽ Π½ΡƒΠΆΠ½ΠΎ ΡƒΡΠ²ΠΎΠΈΡ‚ΡŒ, Π½ΠΎ ΠΏΠΎΠ½ΠΈΠΌΠ°Π½ΠΈΠ΅ этого даст Π²Π°ΠΌ Π±ΠΎΠ»Π΅Π΅ Π³Π»ΡƒΠ±ΠΎΠΊΠΎΠ΅ ΠΏΠΎΠ½ΠΈΠΌΠ°Π½ΠΈΠ΅ ΠΌΠ΅Ρ…Π°Π½ΠΈΠ·ΠΌΠ° Ρ€Π°Π±ΠΎΡ‚Ρ‹ асинхронности выполнСния JavaScript. Π½Π° этой Π΄ΠΈΠ°Π³Ρ€Π°ΠΌΠΌΠ΅ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΠΎ прСдставлСно врСмя Π² миллисСкундах, синиС Π±Π»ΠΎΠΊΠΈ ΠΏΠΎΠΊΠ°Π·Ρ‹Π²Π°ΡŽΡ‚ Π±Π»ΠΎΠΊΠΈ JavaScript ΠΊΠΎΠ΄Π°, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π±Ρ‹Π» Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½. НапримСр, ΠΏΠ΅Ρ€Π²Ρ‹ΠΉ Π±Π»ΠΎΠΊ выполняСтся Π² срСднСм Π·Π° 18мс, ΠΊΠ»ΠΈΠΊ ΠΌΡ‹ΡˆΡŒΡŽ Π±Π»ΠΎΠΊΠΈΡ€ΡƒΠ΅Ρ‚ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π½ΠΎ Π½Π° 11мс ΠΈ Ρ‚.Π΄.

JavaScript ΠΌΠΎΠΆΠ΅Ρ‚ Π²Ρ‹ΠΏΠΎΠ»Π½ΡΡ‚ΡŒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΎΠ΄Π½Ρƒ ΠΏΠΎΡ€Ρ†ΠΈΡŽ ΠΊΠΎΠ΄Π° (ΠΈΠ·-Π·Π° ΠΎΠ΄Π½ΠΎΠΏΠΎΡ‚ΠΎΡ‡Π½ΠΎΠΉ ΠΏΡ€ΠΈΡ€ΠΎΠ΄Ρ‹ выполнСния), каТдая ΠΈΠ· ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… Π±Π»ΠΎΠΊΠΈΡ€ΡƒΠ΅Ρ‚ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ Π΄Ρ€ΡƒΠ³ΠΈΡ… асинхронных событий. Π­Ρ‚ΠΎ Π·Π½Π°Ρ‡ΠΈΡ‚, Ρ‡Ρ‚ΠΎ ΠΏΡ€ΠΈ Π²ΠΎΠ·Π½ΠΈΠΊΠ½ΠΎΠ²Π΅Π½ΠΈΠΈ асинхронного события (Ρ‚Π°ΠΊΠΎΠ³ΠΎ ΠΊΠ°ΠΊ ΠΊΠ»ΠΈΠΊ ΠΌΡ‹ΡˆΡŒΡŽ, Π²Ρ‹Π·ΠΎΠ² Ρ‚Π°ΠΉΠΌΠ΅Ρ€Π° ΠΈΠ»ΠΈ Π·Π°Π²Π΅Ρ€ΡˆΠ΅Π½ΠΈΠ΅ XMLHttp-запроса) ΠΎΠ½ добавляСтся Π² ΠΎΡ‡Π΅Ρ€Π΅Π΄ΡŒ ΠΈ выполняСтся ΠΏΠΎΠ·ΠΆΠ΅ (рСализация, ΠΊΠΎΠ½Π΅Ρ‡Π½ΠΎ ΠΆΠ΅, Π²Π°Ρ€ΡŒΠΈΡ€ΡƒΠ΅Ρ‚ΡΡ Π² зависимости ΠΎΡ‚ Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π°, Π½ΠΎ Π΄Π°Π²Π°ΠΉΡ‚Π΅ условимся Π½Π°Π·Ρ‹Π²Π°Ρ‚ΡŒ это Β«ΠΎΡ‡Π΅Ρ€Π΅Π΄ΡŒΡŽΒ»).

Для Π½Π°Ρ‡Π°Π»Π° прСдставим, Ρ‡Ρ‚ΠΎ Π²Π½ΡƒΡ‚Ρ€ΠΈ JavaScript Π±Π»ΠΎΠΊΠ° ΡΡ‚Π°Ρ€Ρ‚ΡƒΡŽΡ‚ Π΄Π²Π° Ρ‚Π°ΠΉΠΌΠ΅Ρ€Π°: setTimeout с Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠΎΠΉ 10мс ΠΈ setInterval с Ρ‚Π°ΠΊΠΎΠΉ ΠΆΠ΅ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠΎΠΉ. Π’ зависимости ΠΎΡ‚ Ρ‚ΠΎΠ³ΠΎ, ΠΊΠΎΠ³Π΄Π° стартуСт Ρ‚Π°ΠΉΠΌΠ΅Ρ€, ΠΎΠ½ сработаСт Π² ΠΌΠΎΠΌΠ΅Π½Ρ‚, ΠΊΠΎΠ³Π΄Π° ΠΌΡ‹ Π΅Ρ‰Π΅ Π½Π΅ Π·Π°Π²Π΅Ρ€ΡˆΠΈΠ»ΠΈ ΠΏΠ΅Ρ€Π²Ρ‹ΠΉ Π±Π»ΠΎΠΊ ΠΊΠΎΠ΄Π°. Π—Π°ΠΌΠ΅Ρ‚ΡŒΡ‚Π΅, ΠΎΠ΄Π½Π°ΠΊΠΎ, Ρ‡Ρ‚ΠΎ ΠΎΠ½ Π½Π΅ срабатываСт сразу (это Π½Π΅Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ ΠΈΠ·-Π·Π° однопоточности). ВмСсто этого отлоТСнная функция ΠΏΠΎΠΏΠ°Π΄Π°Π΅Ρ‚ Π² ΠΎΡ‡Π΅Ρ€Π΅Π΄ΡŒ ΠΈ исполняСтся Π² ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΉ доступный ΠΌΠΎΠΌΠ΅Π½Ρ‚.

Π’Π°ΠΊΠΆΠ΅ Π²ΠΎ врСмя исполнСния ΠΏΠ΅Ρ€Π²ΠΎΠ³ΠΎ JavaScript Π±Π»ΠΎΠΊΠ° Π²ΠΎΠ·Π½ΠΈΠΊΠ°Π΅Ρ‚ ΠΊΠ»ΠΈΠΊ ΠΌΡ‹ΡˆΡŒΡŽ. ΠžΠ±Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊ этого асинхронного события (Π° ΠΎΠ½ΠΎ асинхронноС, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ ΠΌΡ‹ Π½Π΅ ΠΌΠΎΠΆΠ΅ΠΌ Π΅Π³ΠΎ ΠΏΡ€Π΅Π΄ΡΠΊΠ°Π·Π°Ρ‚ΡŒ) Π½Π΅ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ нСпосрСдствСнно Π² этот ΠΌΠΎΠΌΠ΅Π½Ρ‚, поэтому ΠΎΠ½ Ρ‚ΠΎΠΆΠ΅ ΠΏΠΎΠΏΠ°Π΄Π°Π΅Ρ‚ Π² ΠΎΡ‡Π΅Ρ€Π΅Π΄ΡŒ, ΠΊΠ°ΠΊ ΠΈ Ρ‚Π°ΠΉΠΌΠ΅Ρ€.

ПослС Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ ΠΏΠ΅Ρ€Π²Ρ‹ΠΉ Π±Π»ΠΎΠΊ JavaScript ΠΊΠΎΠ΄Π° Π±Ρ‹Π» Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½, Π±Ρ€Π°ΡƒΠ·Π΅Ρ€ задаСтся вопросом Β«Π§Ρ‚ΠΎ ΠΎΠΆΠΈΠ΄Π°Π΅Ρ‚ исполнСния?Β». Π’ Π΄Π°Π½Π½ΠΎΠΌ случаС ΠΎΠ±Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊ ΠΊΠ»ΠΈΠΊΠ° ΠΌΡ‹ΡˆΡŒΡŽ ΠΈ Ρ‚Π°ΠΉΠΌΠ΅Ρ€ находятся Π² состоянии оТидания. Π‘Ρ€Π°ΡƒΠ·Π΅Ρ€ Π²Ρ‹Π±ΠΈΡ€Π°Π΅Ρ‚ ΠΎΠ΄ΠΈΠ½ ΠΈΠ· Π½ΠΈΡ… (ΠΎΠ±Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊ ΠΊΠ»ΠΈΠΊΠ°) ΠΈ выполняСт Π΅Π³ΠΎ. Π’Π°ΠΉΠΌΠ΅Ρ€ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΠΆΠΈΠ΄Π°Ρ‚ΡŒ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅ΠΉ доступной ΠΏΠΎΡ€Ρ†ΠΈΠΈ Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ Π² ΠΎΡ‡Π΅Ρ€Π΅Π΄ΠΈ Π½Π° исполнСниС.

Π—Π°ΠΌΠ΅Ρ‚ΡŒΡ‚Π΅, Ρ‡Ρ‚ΠΎ ΠΏΠΎΠΊΠ° ΠΎΠ±Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊ ΠΊΠ»ΠΈΠΊΠ° ΠΌΡ‹ΡˆΡŒΡŽ выполняСтся, срабатываСт ΠΏΠ΅Ρ€Π²Ρ‹ΠΉ interval-callback. Π’Π°ΠΊ ΠΆΠ΅ ΠΊΠ°ΠΊ ΠΈ timer-callback, ΠΎΠ½ Π±ΡƒΠ΄Π΅Ρ‚ поставлСн Π² ΠΎΡ‡Π΅Ρ€Π΅Π΄ΡŒ. Π’Π΅ΠΌ Π½Π΅ ΠΌΠ΅Π½Π΅Π΅, ΡƒΡ‡Ρ‚ΠΈΡ‚Π΅, Ρ‡Ρ‚ΠΎ ΠΊΠΎΠ³Π΄Π° снова сработаСт interval (ΠΏΠΎΠΊΠ° Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹ΠΏΠΎΠ»Π½ΡΡ‚ΡŒΡΡ timer-callback), Ρ‚ΠΎ ΠΎΠ½ Π±ΡƒΠ΄Π΅Ρ‚ ΡƒΠ΄Π°Π»Π΅Π½ ΠΈΠ· ΠΎΡ‡Π΅Ρ€Π΅Π΄ΠΈ. Если Π±Ρ‹ всС interval-callback’ΠΈ ΠΏΠΎΠΏΠ°Π΄Π°Π»ΠΈ Π² ΠΎΡ‡Π΅Ρ€Π΅Π΄ΡŒ ΠΏΠΎΠΊΠ° исполняСтся большой кусок ΠΊΠΎΠ΄Π°, это Π±Ρ‹ ΠΏΡ€ΠΈΠ²Π΅Π»ΠΎ ΠΊ Ρ‚ΠΎΠΌΡƒ, Ρ‡Ρ‚ΠΎ ΠΎΠ±Ρ€Π°Π·ΠΎΠ²Π°Π»Π°ΡΡŒ Π±Ρ‹ ΠΊΡƒΡ‡Π° Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΉ, ΠΎΠΆΠΈΠ΄Π°ΡŽΡ‰ΠΈΡ… Π²Ρ‹Π·ΠΎΠ²Π° Π±Π΅Π· ΠΏΠ΅Ρ€ΠΈΠΎΠ΄ΠΎΠ² Π·Π°Π΄Π΅Ρ€ΠΆΠ΅ΠΊ ΠΌΠ΅ΠΆΠ΄Ρƒ ΠΎΠΊΠΎΠ½Ρ‡Π°Π½ΠΈΠ΅ΠΌ ΠΈΡ… выполнСния. ВмСсто этого Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Ρ‹ стрСмятся ΠΆΠ΄Π°Ρ‚ΡŒ ΠΏΠΎΠΊΠ° Π½Π΅ останСтся Π½ΠΈ ΠΎΠ΄Π½ΠΎΠΉ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ Π² ΠΎΡ‡Π΅Ρ€Π΅Π΄ΠΈ ΠΏΡ€Π΅ΠΆΠ΄Π΅ Ρ‡Π΅ΠΌ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π² ΠΎΡ‡Π΅Ρ€Π΅Π΄ΡŒ Π΅Ρ‰Π΅ ΠΎΠ΄Π½Ρƒ.

Π’Π°ΠΊΠΈΠΌ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ, ΠΌΡ‹ ΠΌΠΎΠΆΠ΅ΠΌ Π½Π°Π±Π»ΡŽΠ΄Π°Ρ‚ΡŒ случай, ΠΊΠΎΠ³Π΄Π° Ρ‚Ρ€Π΅Ρ‚ΡŒΠ΅ срабатываниС interval-callback совпадаСт с Ρ‚Π΅ΠΌ ΠΌΠΎΠΌΠ΅Π½Ρ‚ΠΎΠΌ, ΠΊΠΎΠ³Π΄Π° ΠΎΠ½ ΡƒΠΆΠ΅ исполняСтся. Π­Ρ‚ΠΎ ΠΈΠ»Π»ΡŽΡΡ‚Ρ€ΠΈΡ€ΡƒΠ΅Ρ‚ Π²Π°ΠΆΠ½ΡƒΡŽ ΠΎΡΠΎΠ±Π΅Π½Π½ΠΎΡΡ‚ΡŒ: ΠΈΠ½Ρ‚Π΅Ρ€Π²Π°Π»Ρ‹ Π½Π΅ заботятся ΠΎ Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎ выполняСтся Π² Ρ‚Π΅ΠΊΡƒΡ‰ΠΈΠΉ ΠΌΠΎΠΌΠ΅Π½Ρ‚, ΠΎΠ½ΠΈ Π±ΡƒΠ΄ΡƒΡ‚ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½Ρ‹ Π² ΠΎΡ‡Π΅Ρ€Π΅Π΄ΡŒ Π±Π΅Π· ΡƒΡ‡Π΅Ρ‚Π° ΠΏΠ΅Ρ€ΠΈΠΎΠ΄Π° Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠΈ ΠΌΠ΅ΠΆΠ΄Ρƒ исполнСниями.

НаконСц, послС Ρ‚ΠΎΠ³ΠΎ ΠΊΠ°ΠΊ Π²Ρ‚ΠΎΡ€ΠΎΠΉ interval-callback Π·Π°Π²Π΅Ρ€ΡˆΠΈΡ‚ΡΡ, ΠΌΡ‹ ΡƒΠ²ΠΈΠ΄ΠΈΠΌ Ρ‡Ρ‚ΠΎ Π½Π΅ ΠΎΡΡ‚Π°Π»ΠΎΡΡŒ Π½ΠΈΡ‡Π΅Π³ΠΎ, Ρ‡Ρ‚ΠΎ JavaScript-Π΄Π²ΠΈΠΆΠΎΠΊ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π²Ρ‹ΠΏΠΎΠ»Π½ΠΈΡ‚ΡŒ. Π­Ρ‚ΠΎ Π·Π½Π°Ρ‡ΠΈΡ‚, Ρ‡Ρ‚ΠΎ Π±Ρ€Π°ΡƒΠ·Π΅Ρ€ снова ΠΆΠ΄Π΅Ρ‚ появлСния Π½ΠΎΠ²Ρ‹Ρ… асинхронных событий. Π­Ρ‚ΠΎ случится Π½Π° ΠΎΡ‚ΠΌΠ΅Ρ‚ΠΊΠ΅ 50мс, Π³Π΄Π΅ interval-callback сработаСт ΠΎΠΏΡΡ‚ΡŒ. Π’ этот ΠΌΠΎΠΌΠ΅Π½Ρ‚ Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ Π½ΠΈΡ‡Π΅Π³ΠΎ, Ρ‡Ρ‚ΠΎ Π±Π»ΠΎΠΊΠΈΡ€ΠΎΠ²Π°Π»ΠΎ Π±Ρ‹ Π΅Π³ΠΎ, поэтому ΠΎΠ½ сработаСт Π½Π΅Π·Π°ΠΌΠ΅Π΄Π»ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ.

Π”Π°Π²Π°ΠΉΡ‚Π΅ рассмотрим ΠΏΡ€ΠΈΠΌΠ΅Ρ€, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Ρ…ΠΎΡ€ΠΎΡˆΠΎ ΠΈΠ»Π»ΡŽΡΡ‚Ρ€ΠΈΡ€ΡƒΠ΅Ρ‚ Ρ€Π°Π·Π½ΠΈΡ†Ρƒ ΠΌΠ΅ΠΆΠ΄Ρƒ setTimeout ΠΈ setInterval.

Π­Ρ‚ΠΈ Π΄Π²Π° Π²Π°Ρ€ΠΈΠ°Π½Ρ‚Π° эквивалСнтны Π½Π° ΠΏΠ΅Ρ€Π²Ρ‹ΠΉ взгляд, Π½ΠΎ Π½Π° самом Π΄Π΅Π»Π΅ это Π½Π΅ Ρ‚Π°ΠΊ. Код, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‰ΠΈΠΉ setTimeout Π±ΡƒΠ΄Π΅Ρ‚ всСгда ΠΈΠΌΠ΅Ρ‚ΡŒ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΡƒ хотя Π±Ρ‹ 10мс послС ΠΏΡ€Π΅Π΄Ρ‹Π΄ΡƒΡ‰Π΅Π³ΠΎ Π²Ρ‹Π·ΠΎΠ²Π° (ΠΎΠ½ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ большС, Π½ΠΎ Π½ΠΈΠΊΠΎΠ³Π΄Π° Π½Π΅ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ мСньшС), Ρ‚ΠΎΠ³Π΄Π° ΠΊΠ°ΠΊ ΠΊΠΎΠ΄, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‰ΠΈΠΉ setInterval Π±ΡƒΠ΄Π΅Ρ‚ ΡΡ‚Ρ€Π΅ΠΌΠΈΡ‚ΡŒΡΡ Π²Ρ‹Π·Ρ‹Π²Π°Ρ‚ΡŒΡΡ ΠΊΠ°ΠΆΠ΄Ρ‹Π΅ 10мс нСзависимо ΠΎΡ‚ Ρ‚ΠΎΠ³ΠΎ, ΠΊΠΎΠ³Π΄Π° ΠΎΡ‚Ρ€Π°Π±ΠΎΡ‚Π°Π» ΠΏΡ€Π΅Π΄Ρ‹ΡƒΡ‰ΠΈΠΉ Π²Ρ‹Π·ΠΎΠ².

Π”Π°Π²Π°ΠΉΡ‚Π΅ Ρ€Π΅Π·ΡŽΠΌΠΈΡ€ΡƒΠ΅ΠΌ всС сказанноС Π²Ρ‹ΡˆΠ΅:
β€” JavaScript Π΄Π²ΠΈΠΆΠΊΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ ΠΎΠ΄Π½ΠΎΠΏΠΎΡ‚ΠΎΡ‡Π½ΡƒΡŽ срСду, прСобразовывая асинхронныС события Π² ΠΎΡ‡Π΅Ρ€Π΅Π΄ΡŒ, ΠΎΠΆΠΈΠ΄Π°ΡŽΡ‰ΡƒΡŽ исполнСния,
β€” Π€ΡƒΠ½ΠΊΡ†ΠΈΠΈ setTimeout ΠΈ setInterval ΠΏΡ€ΠΈΠ½Ρ†ΠΈΠΏΠΈΠ°Π»ΡŒΠ½ΠΎ ΠΏΠΎ-Ρ€Π°Π·Π½ΠΎΠΌΡƒ ΠΈΡΠΏΠΎΠ»Π½ΡΡŽΡ‚ΡΡ Π² асинхронном ΠΊΠΎΠ΄Π΅,
β€” Если Ρ‚Π°ΠΉΠΌΠ΅Ρ€ Π½Π΅ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ Π² Π΄Π°Π½Π½Ρ‹ΠΉ ΠΌΠΎΠΌΠ΅Π½Ρ‚, ΠΎΠ½ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΡ‚Π»ΠΎΠΆΠ΅Π½ Π΄ΠΎ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅ΠΉ Ρ‚ΠΎΡ‡ΠΊΠΈ исполнСния (которая Π±ΡƒΠ΄Π΅Ρ‚ дольшС, Ρ‡Π΅ΠΌ ТСлаСмая Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠ°),
β€” Π˜Π½Ρ‚Π΅Ρ€Π²Π°Π»Ρ‹ (setInterval) ΠΌΠΎΠ³ΡƒΡ‚ ΠΈΡΠΏΠΎΠ»Π½ΡΡ‚ΡŒΡΡ Π΄Ρ€ΡƒΠ³ Π·Π° Π΄Ρ€ΡƒΠ³ΠΎΠΌ Π±Π΅Π· Π·Π°Π΄Π΅Ρ€ΠΆΠ΅ΠΊ, Ссли ΠΈΡ… исполнСниС Π·Π°Π½ΠΈΠΌΠ°Π΅Ρ‚ большС Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ, Ρ‡Π΅ΠΌ указанная Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠ°.

ВсС это являСтся Ρ‡Ρ€Π΅Π·Π²Ρ‹Ρ‡Π°ΠΉΠ½ΠΎ Π²Π°ΠΆΠ½ΠΎΠΉ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΠ΅ΠΉ для Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ. Π—Π½Π°Π½ΠΈΠ΅ Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ JavaScript Π΄Π²ΠΈΠΆΠΎΠΊ, особСнно с большим количСством асинхронных событий (Ρ‡Ρ‚ΠΎ Π·Π°Ρ‡Π°ΡΡ‚ΡƒΡŽ случаСтся), Π·Π°ΠΊΠ»Π°Π΄Ρ‹Π²Π°Π΅Ρ‚ ΠΎΡ‚Π»ΠΈΡ‡Π½Ρ‹ΠΉ Ρ„ΡƒΠ½Π΄Π°ΠΌΠ΅Π½Ρ‚ для построСния ΠΏΡ€ΠΎΠ΄Π²ΠΈΠ½ΡƒΡ‚Ρ‹Ρ… ΠΏΡ€ΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΉ.

Π˜ΡΡ‚ΠΎΡ‡Π½ΠΈΠΊ

ΠžΠ±ΡŠΠ΅Π΄ΠΈΠ½Ρ‘Π½Π½Ρ‹ΠΉ асинхронный JavaScript: Π’Π°ΠΉΠΌΠ°ΡƒΡ‚Ρ‹ ΠΈ ΠΈΠ½Ρ‚Π΅Ρ€Π²Π°Π»Ρ‹

НСобходимыС условия:Базовая ΠΊΠΎΠΌΠΏΡŒΡŽΡ‚Π΅Ρ€Π½Π°Ρ Π³Ρ€Π°ΠΌΠΎΡ‚Π½ΠΎΡΡ‚ΡŒ, достаточноС ΠΏΠΎΠ½ΠΈΠΌΠ°Π½ΠΈΠ΅ основ JavaScript.
ЦСль:ПониманиС асинхронных Ρ†ΠΈΠΊΠ»ΠΎΠ² ΠΈ ΠΈΠ½Ρ‚Π΅Ρ€Π²Π°Π»ΠΎΠ², ΠΈ Ρ‚ΠΎ ΠΊΠ°ΠΊ ΠΈΡ… ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ.

Π’Π²Π΅Π΄Π΅Π½ΠΈΠ΅

Π’ Ρ‚Π΅Ρ‡Π΅Π½ΠΈΠ΅ Π΄ΠΎΠ»Π³ΠΎΠ³ΠΎ Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ Π²Π΅Π±-ΠΏΠ»Π°Ρ‚Ρ„ΠΎΡ€ΠΌΠ° ΠΏΡ€Π΅Π΄Π»Π°Π³Π°Π»Π° программистам JavaScript ряд Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΉ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ позволяли ΠΈΠΌ асинхронно Π²Ρ‹ΠΏΠΎΠ»Π½ΡΡ‚ΡŒ ΠΊΠΎΠ΄ ΠΏΠΎ истСчСнии ΠΎΠΏΡ€Π΅Π΄Π΅Π»Ρ‘Π½Π½ΠΎΠ³ΠΎ Π²Ρ€Π΅ΠΌΠ΅Π½Π½ΠΎΠ³ΠΎ ΠΈΠ½Ρ‚Π΅Ρ€Π²Π°Π»Π° ΠΈ ΠΏΠΎΠ²Ρ‚ΠΎΡ€Π½ΠΎ Π²Ρ‹ΠΏΠΎΠ»Π½ΡΡ‚ΡŒ асинхронный Π±Π»ΠΎΠΊ ΠΊΠΎΠ΄Π°, ΠΏΠΎΠΊΠ° Π²Ρ‹ Π½Π΅ скаТСтС Π΅ΠΌΡƒ ΠΎΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒΡΡ.

setTimeout() ВыполняСт ΡƒΠΊΠ°Π·Π°Π½Π½Ρ‹ΠΉ Π±Π»ΠΎΠΊ ΠΊΠΎΠ΄Π° ΠΎΠ΄ΠΈΠ½ Ρ€Π°Π· ΠΏΠΎ истСчСнии ΡƒΠΊΠ°Π·Π°Π½Π½ΠΎΠ³ΠΎ Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ setInterval() ВыполняСт ΡƒΠΊΠ°Π·Π°Π½Π½Ρ‹ΠΉ Π±Π»ΠΎΠΊ ΠΊΠΎΠ΄Π° нСсколько Ρ€Π°Π· с ΠΎΠΏΡ€Π΅Π΄Π΅Π»Ρ‘Π½Π½Ρ‹ΠΌ ΠΈΠ½Ρ‚Π΅Ρ€Π²Π°Π»ΠΎΠΌ ΠΌΠ΅ΠΆΠ΄Ρƒ ΠΊΠ°ΠΆΠ΄Ρ‹ΠΌ Π²Ρ‹Π·ΠΎΠ²ΠΎΠΌ. requestAnimationFrame() БоврСмСнная вСрсия setInterval (). Π’Ρ‹ΠΏΠΎΠ»Π½ΡΡŽΡ‚ ΡƒΠΊΠ°Π·Π°Π½Π½Ρ‹ΠΉ Π±Π»ΠΎΠΊ ΠΊΠΎΠ΄Π° ΠΏΠ΅Ρ€Π΅Π΄ Ρ‚Π΅ΠΌ, ΠΊΠ°ΠΊ Π±Ρ€Π°ΡƒΠ·Π΅Ρ€ Π² ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΉ Ρ€Π°Π· пСрСрисовываСт ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅, позволяя Π·Π°ΠΏΡƒΡΠΊΠ°Ρ‚ΡŒ Π°Π½ΠΈΠΌΠ°Ρ†ΠΈΡŽ с подходящСй частотой ΠΊΠ°Π΄Ρ€ΠΎΠ² нСзависимо ΠΎΡ‚ срСды, Π² ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ ΠΎΠ½Π° выполняСтся.

Асинхронный ΠΊΠΎΠ΄, установлСнный этими функциями, выполняСтся Π² основном ΠΏΠΎΡ‚ΠΎΠΊΠ΅ (ΠΏΠΎ истСчСнии ΡƒΠΊΠ°Π·Π°Π½Π½ΠΎΠ³ΠΎ ΠΈΠΌ Ρ‚Π°ΠΉΠΌΠ΅Ρ€Π°).

Π’Π°ΠΆΠ½ΠΎ Π·Π½Π°Ρ‚ΡŒ, Ρ‡Ρ‚ΠΎ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ (ΠΈ часто Π±ΡƒΠ΄Π΅Ρ‚Π΅) Π·Π°ΠΏΡƒΡΠΊΠ°Ρ‚ΡŒ Π΄Ρ€ΡƒΠ³ΠΎΠΉ ΠΊΠΎΠ΄ Π΄ΠΎ выполнСния Π²Ρ‹Π·ΠΎΠ²Π° setTimeout () ΠΈΠ»ΠΈ ΠΌΠ΅ΠΆΠ΄Ρƒ итСрациями setInterval (). Π’ зависимости ΠΎΡ‚ Ρ‚ΠΎΠ³ΠΎ, насколько интСнсивно ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ΡΡ эти ΠΎΠΏΠ΅Ρ€Π°Ρ†ΠΈΠΈ для процСссора, ΠΎΠ½ΠΈ ΠΌΠΎΠ³ΡƒΡ‚ Π΅Ρ‰Ρ‘ большС Π·Π°Π΄Π΅Ρ€ΠΆΠ°Ρ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ асинхронного ΠΊΠΎΠ΄Π°, ΠΏΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ любой асинхронный ΠΊΠΎΠ΄ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹ΠΏΠΎΠ»Π½ΡΡ‚ΡŒΡΡ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ послС Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ станСт доступСн основной ΠΏΠΎΡ‚ΠΎΠΊ. (Π”Ρ€ΡƒΠ³ΠΈΠΌΠΈ словами, ΠΊΠΎΠ³Π΄Π° стСк пуст.) Π²Ρ‹ ΡƒΠ·Π½Π°Π΅Ρ‚Π΅ большС ΠΏΠΎ этому вопросу ΠΏΠΎ ΠΌΠ΅Ρ€Π΅ изучСния этой ΡΡ‚Π°Ρ‚ΡŒΠΈ.

Π’ любом случаС эти Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ΡΡ для запуска постоянной Π°Π½ΠΈΠΌΠ°Ρ†ΠΈΠΈ ΠΈ Π΄Ρ€ΡƒΠ³ΠΎΠΉ Ρ„ΠΎΠ½ΠΎΠ²ΠΎΠΉ ΠΎΠ±Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ Π½Π° Π²Π΅Π±-сайтС ΠΈΠ»ΠΈ Π² ΠΏΡ€ΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΈ. Π’ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΡ… Ρ€Π°Π·Π΄Π΅Π»Π°Ρ… ΠΌΡ‹ ΠΏΠΎΠΊΠ°ΠΆΠ΅ΠΌ Π²Π°ΠΌ, ΠΊΠ°ΠΊ ΠΈΡ… ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ.

setTimeout()

Как ΠΌΡ‹ Ρ€Π°Π½Π΅Π΅ ΠΎΡ‚ΠΌΠ΅Ρ‚ΠΈΠ»ΠΈ, setTimeout () выполняСт ΠΎΠΏΡ€Π΅Π΄Π΅Π»Ρ‘Π½Π½Ρ‹ΠΉ Π±Π»ΠΎΠΊ ΠΊΠΎΠ΄Π° ΠΎΠ΄ΠΈΠ½ Ρ€Π°Π· ΠΏΠΎ истСчСнии Π·Π°Π΄Π°Π½Π½ΠΎΠ³ΠΎ Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ. ΠŸΡ€ΠΈΠ½ΠΈΠΌΠ°Π΅Ρ‚ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹:

NOTE: Π£ΠΊΠ°Π·Π°Π½Π½ΠΎΠ΅ врСмя (ΠΈΠ»ΠΈ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠ°) Π½Π΅ являСтся Π³Π°Ρ€Π°Π½Ρ‚ΠΈΡ€ΠΎΠ²Π°Π½Π½Ρ‹ΠΌ Π²Ρ€Π΅ΠΌΠ΅Π½Π΅ΠΌ выполнСния, Π° скорСС ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΡŒΠ½Ρ‹ΠΌ Π²Ρ€Π΅ΠΌΠ΅Π½Π΅ΠΌ выполнСния. ΠžΠ±Ρ€Π°Ρ‚Π½Ρ‹Π΅ Π²Ρ‹Π·ΠΎΠ²Ρ‹, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ ΠΏΠ΅Ρ€Π΅Π΄Π°Ρ‘Ρ‚Π΅ этим функциям, Π½Π΅ ΠΌΠΎΠ³ΡƒΡ‚ Π²Ρ‹ΠΏΠΎΠ»Π½ΡΡ‚ΡŒΡΡ, ΠΏΠΎΠΊΠ° стСк Π² основном ΠΏΠΎΡ‚ΠΎΠΊΠ΅ Π½Π΅ станСт пустым.

Как слСдствиС, Ρ‚Π°ΠΊΠΎΠΉ ΠΊΠΎΠ΄, ΠΊΠ°ΠΊ setTimeout (fn, 0), Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹ΠΏΠΎΠ»Π½ΡΡ‚ΡŒΡΡ, ΠΊΠ°ΠΊ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ стСк Π±ΡƒΠ΄Π΅Ρ‚ пуст, Π° Π½Π΅ сразу. Если Π²Ρ‹ Π²Ρ‹ΠΏΠΎΠ»Π½ΠΈΡ‚Π΅ Ρ‚Π°ΠΊΠΎΠΉ ΠΊΠΎΠ΄, ΠΊΠ°ΠΊ setTimeout (fn, 0), Π½ΠΎ сразу послС выполнСния Ρ†ΠΈΠΊΠ»Π°, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ насчитываСт ΠΎΡ‚ 1 Π΄ΠΎ 10 ΠΌΠΈΠ»Π»ΠΈΠ°Ρ€Π΄ΠΎΠ², ваш колбэк Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ Ρ‡Π΅Ρ€Π΅Π· нСсколько сСкунд.

Π’ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅ΠΌ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π΅, Π±Ρ€Π°ΡƒΠ·Π΅Ρ€ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΠΆΠΈΠ΄Π°Ρ‚ΡŒ Π΄Π²Π΅ сСкунды ΠΏΠ΅Ρ€Π΅Π΄ Ρ‚Π΅ΠΌ ΠΊΠ°ΠΊ Π²Ρ‹ΠΏΠΎΠ»Π½ΠΈΡ‚ Π°Π½ΠΎΠ½ΠΈΠΌΠ½ΡƒΡŽ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ, Ρ‚ΠΎΠ³Π΄Π° ΠΎΡ‚ΠΎΠ±Ρ€Π°Π·ΠΈΡ‚ сообщСниС (ΠΆΠΈΠ²ΠΎΠΉ ΠΏΡ€ΠΈΠΌΠ΅Ρ€, ΠΈ исходный ΠΊΠΎΠ΄):

Π£ΠΊΠ°Π·Π°Π½Π½Ρ‹Π΅ Π²Π°ΠΌΠΈ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ Π½Π΅ ΠΎΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Π±Ρ‹Ρ‚ΡŒ Π°Π½ΠΎΠ½ΠΈΠΌΠ½Ρ‹ΠΌΠΈ. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π΄Π°Ρ‚ΡŒ своСй Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ имя ΠΈ Π΄Π°ΠΆΠ΅ ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΠΈΡ‚ΡŒ Π΅Ρ‘ Π³Π΄Π΅-Π½ΠΈΠ±ΡƒΠ΄ΡŒ Π΅Ρ‰Ρ‘ ΠΈ ΠΏΠ΅Ρ€Π΅Π΄Π°Ρ‚ΡŒ ссылку Π½Π° Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ Π² setTimeout (). Π‘Π»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ Π΄Π²Π΅ вСрсии Ρ„Ρ€Π°Π³ΠΌΠ΅Π½Ρ‚Π° ΠΊΠΎΠ΄Π° эквивалСнтны ΠΏΠ΅Ρ€Π²ΠΎΠΉ:

Π­Ρ‚ΠΎ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ ΠΏΠΎΠ»Π΅Π·Π½ΠΎ, Ссли Ρƒ вас Π΅ΡΡ‚ΡŒ функция, ΠΊΠΎΡ‚ΠΎΡ€ΡƒΡŽ Π½ΡƒΠΆΠ½ΠΎ Π²Ρ‹Π·Ρ‹Π²Π°Ρ‚ΡŒ ΠΊΠ°ΠΊ ΠΏΠΎ Ρ‚Π°ΠΉΠΌΠ°ΡƒΡ‚Ρƒ, Ρ‚Π°ΠΊ Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€ ΠΈ Π² ΠΎΡ‚Π²Π΅Ρ‚ Π½Π° событиС. Но это Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΠΎΠΌΠΎΡ‡ΡŒ ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°Ρ‚ΡŒ ваш ΠΊΠΎΠ΄ Π² чистотС, особСнно Ссли колбэк Ρ‚Π°ΠΉΠΌ-Π°ΡƒΡ‚Π° Π·Π°Π½ΠΈΠΌΠ°Π΅Ρ‚ большС, Ρ‡Π΅ΠΌ нСсколько строк ΠΊΠΎΠ΄Π°.

setTimeout () Π²ΠΎΠ·Π²Ρ€Π°Ρ‰Π°Π΅Ρ‚ Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ ΠΈΠ΄Π΅Π½Ρ‚ΠΈΡ„ΠΈΠΊΠ°Ρ‚ΠΎΡ€Π°, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ для ссылки Π½Π° Ρ‚Π°ΠΉΠΌ-Π°ΡƒΡ‚ ΠΏΠΎΠ·ΠΆΠ΅, Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, ΠΊΠΎΠ³Π΄Π° Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π΅Π³ΠΎ ΠΎΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ.

ΠŸΠ΅Ρ€Π΅Π΄Π°Ρ‡Π° ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€ΠΎΠ² Π² Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ setTimeout ()

Π›ΡŽΠ±Ρ‹Π΅ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΏΠ΅Ρ€Π΅Π΄Π°Ρ‚ΡŒ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ, выполняСмой Π²Π½ΡƒΡ‚Ρ€ΠΈ setTimeout (), Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Π±Ρ‹Ρ‚ΡŒ ΠΏΠ΅Ρ€Π΅Π΄Π°Π½Ρ‹ Π΅ΠΉ ΠΊΠ°ΠΊ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ Π² ΠΊΠΎΠ½Ρ†Π΅ списка.

НапримСр, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Ρ€Π΅ΠΎΡ€Π³Π°Π½ΠΈΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΏΡ€Π΅Π΄Ρ‹Π΄ΡƒΡ‰ΡƒΡŽ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ½Π° ΠΏΠ΅Ρ€Π΅Π΄Π°Π²Π°Π»Π° ΠΏΡ€ΠΈΠ²Π΅Ρ‚ Π»ΡŽΠ±ΠΎΠΌΡƒ ΠΈΠΌΠ΅Π½ΠΈ, ΠΏΠ΅Ρ€Π΅Π΄Π°Π½Π½ΠΎΠΌΡƒ Π΅ΠΉ:

Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΏΠ΅Ρ€Π΅Π΄Π°Ρ‚ΡŒ имя Π² Π²Ρ‹Π·ΠΎΠ² setTimeout () Π² качСствС Ρ‚Ρ€Π΅Ρ‚ΡŒΠ΅Π³ΠΎ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Π°:

ΠžΡ‡ΠΈΡΡ‚ΠΊΠ° Ρ‚Π°ΠΉΠΌΠ°ΡƒΡ‚ΠΎΠ²

Note: Π‘ΠΌ. greeter-app.html для Π±ΠΎΠ»Π΅Π΅ ΠΏΠΎΠ»Π½ΠΎΠΉ дСмонстрации, которая позволяСт Π²Π°ΠΌ ΡƒΠΊΠ°Π·Π°Ρ‚ΡŒ имя для привСтствия ΠΈ ΠΎΡ‚ΠΌΠ΅Π½ΠΈΡ‚ΡŒ привСтствиС с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½ΠΎΠΉ ΠΊΠ½ΠΎΠΏΠΊΠΈ (см. исходный ΠΊΠΎΠ΄).

setInterval()

ΠžΡ‡ΠΈΡΡ‚ΠΊΠ° ΠΈΠ½Ρ‚Π΅Ρ€Π²Π°Π»Π°

АктивноС ΠΎΠ±ΡƒΡ‡Π΅Π½ΠΈΠ΅: Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ собствСнного сСкундомСра!

Π’Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒ врСмя, ΠΊΠ°ΠΊ ΠΈ Ρ€Π°Π½ΡŒΡˆΠ΅, Π½ΠΎ Π² этом ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π΅ Π²Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ:

НСсколько подсказок для вас:

Note: Если Π²Ρ‹ застряли, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ Π½Π°ΡˆΡƒ Π²Π΅Ρ€ΡΠΈΡŽ (см. Ρ‚Π°ΠΊΠΆΠ΅ исходный ΠΊΠΎΠ΄ ).

Π§Ρ‚ΠΎ Π½ΡƒΠΆΠ½ΠΎ ΠΏΠΎΠΌΠ½ΠΈΡ‚ΡŒ ΠΎ setTimeout () ΠΈ setInterval ()

ΠŸΡ€ΠΈ Ρ€Π°Π±ΠΎΡ‚Π΅ с setTimeout () ΠΈ setInterval () слСдуСт ΠΏΠΎΠΌΠ½ΠΈΡ‚ΡŒ ΠΎ Π½Π΅ΡΠΊΠΎΠ»ΡŒΠΊΠΈΡ… Π²Π΅Ρ‰Π°Ρ…. Π”Π°Π²Π°ΠΉΡ‚Π΅ рассмотрим ΠΈΡ….

РСкурсивныС Ρ‚Π°ΠΉΠΌΠ°ΡƒΡ‚Ρ‹

Π’ ΠΏΡ€ΠΈΠ²Π΅Π΄Ρ‘Π½Π½ΠΎΠΌ Π½ΠΈΠΆΠ΅ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ рСкурсивный setTimeout () для запуска ΠΏΠ΅Ρ€Π΅Π΄Π°Π½Π½ΠΎΠΉ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ ΠΊΠ°ΠΆΠ΄Ρ‹Π΅ 100 миллисСкунд:

Π Π°Π·Π½ΠΈΡ†Π° ΠΌΠ΅ΠΆΠ΄Ρƒ двумя вСрсиями ΠΏΡ€ΠΈΠ²Π΅Π΄Ρ‘Π½Π½ΠΎΠ³ΠΎ Π²Ρ‹ΡˆΠ΅ ΠΊΠΎΠ΄Π° Π½Π΅Π²Π΅Π»ΠΈΠΊΠ°.

НСмСдлСнныС Ρ‚Π°ΠΉΠΌΠ°ΡƒΡ‚Ρ‹

ИспользованиС 0 Π² качСствС значСния для setTimeout () позволяСт ΠΏΠ»Π°Π½ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ ΡƒΠΊΠ°Π·Π°Π½Π½ΠΎΠΉ колбэк-Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ ΠΊΠ°ΠΊ ΠΌΠΎΠΆΠ½ΠΎ скорСС, Π½ΠΎ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ послС Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π±ΡƒΠ΄Π΅Ρ‚ Π·Π°ΠΏΡƒΡ‰Π΅Π½ основной ΠΏΠΎΡ‚ΠΎΠΊ ΠΊΠΎΠ΄Π°.

ΠžΡ‡ΠΈΡΡ‚ΠΊΠ° с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ clearTimeout() ΠΈΠ»ΠΈ clearInterval()

clearTimeout () ΠΈ clearInterval () ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ ΠΎΠ΄ΠΈΠ½ ΠΈ Ρ‚ΠΎΡ‚ ΠΆΠ΅ список записСй для очистки. Π˜Π½Ρ‚Π΅Ρ€Π΅ΡΠ½ΠΎ, Ρ‡Ρ‚ΠΎ это ΠΎΠ·Π½Π°Ρ‡Π°Π΅Ρ‚, Ρ‡Ρ‚ΠΎ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ любой ΠΌΠ΅Ρ‚ΠΎΠ΄ для очистки setTimeout () ΠΈΠ»ΠΈ setInterval ().

requestAnimationFrame()

Note: Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π½Π°ΠΉΡ‚ΠΈ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Ρ‹ использования requestAnimationFrame() Π² этом курсС β€” Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€ Π² РисованиС Π³Ρ€Π°Ρ„ΠΈΠΊΠΈ, and ΠŸΡ€Π°ΠΊΡ‚ΠΈΠΊΠ° построСния ΠΎΠ±ΡŠΠ΅ΠΊΡ‚ΠΎΠ².

ΠœΠ΅Ρ‚ΠΎΠ΄ ΠΏΡ€ΠΈΠ½ΠΈΠΌΠ°Π΅Ρ‚ Π² качСствС Π°Ρ€Π³ΡƒΠΌΠ΅Π½Ρ‚Π° колбэк, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±Ρ‹Ρ‚ΡŒ Π²Ρ‹Π·Π²Π°Π½ ΠΏΠ΅Ρ€Π΅Π΄ пСрСрисовкой. Π­Ρ‚ΠΎ ΠΎΠ±Ρ‰ΠΈΠΉ шаблон, Π² ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΌ ΠΎΠ½ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ:

ИдСя состоит Π² Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΠΈΡ‚ΡŒ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ, Π² ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ ваша анимация обновляСтся (Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, ваши спрайты ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Ρ‰Π°ΡŽΡ‚ΡΡ, счёт обновляСтся, Π΄Π°Π½Π½Ρ‹Π΅ ΠΎΠ±Π½ΠΎΠ²Π»ΡΡŽΡ‚ΡΡ ΠΈΠ»ΠΈ Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ Π΅Ρ‰Ρ‘). Π—Π°Ρ‚Π΅ΠΌ Π²Ρ‹ Π²Ρ‹Π·Ρ‹Π²Π°Π΅Ρ‚Π΅ Π΅Π³ΠΎ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π°Ρ‡Π°Ρ‚ΡŒ процСсс. Π’ ΠΊΠΎΠ½Ρ†Π΅ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΎΠ½Π°Π»ΡŒΠ½ΠΎΠ³ΠΎ Π±Π»ΠΎΠΊΠ° Π²Ρ‹ Π²Ρ‹Π·Ρ‹Π²Π°Π΅Ρ‚Π΅ requestAnimationFrame () со ссылкой Π½Π° Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ, ΠΏΠ΅Ρ€Π΅Π΄Π°Π½Π½ΠΎΠΉ Π² качСствС ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Π°, ΠΈ это Π΄Π°Ρ‘Ρ‚ Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Ρƒ ΡƒΠΊΠ°Π·Π°Π½ΠΈΠ΅ Π²Ρ‹Π·Π²Π°Ρ‚ΡŒ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ снова ΠΏΡ€ΠΈ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅ΠΉ пСрСрисовкС дисплСя. Π—Π°Ρ‚Π΅ΠΌ ΠΎΠ½ выполняСтся Π½Π΅ΠΏΡ€Π΅Ρ€Ρ‹Π²Π½ΠΎ, ΠΏΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ ΠΊΠΎΠ΄ рСкурсивно Π²Ρ‹Π·Ρ‹Π²Π°Π΅Ρ‚ requestAnimationFrame ().

Однако, Ссли Π²Ρ‹ Π΄Π΅Π»Π°Π΅Ρ‚Π΅ Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ Π±ΠΎΠ»Π΅Π΅ слоТноС, Π²ΠΊΠ»ΡŽΡ‡Π°ΡŽΡ‰Π΅Π΅ ΠΎΠ±ΡŠΠ΅ΠΊΡ‚Ρ‹, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π½Π΅ доступны Π½Π°ΠΏΡ€ΡΠΌΡƒΡŽ Π² the DOM (Ρ‚Π°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ 2D Canvas API ΠΈΠ»ΠΈ WebGL ), requestAnimationFrame() ΠΏΡ€Π΅Π΄ΠΏΠΎΡ‡Ρ‚ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚ Π² Π±ΠΎΠ»ΡŒΡˆΠΈΠ½ΡΡ‚Π²Π΅ случаСв.

Как быстро Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ ваша анимация?

ΠŸΠ»Π°Π²Π½ΠΎΡΡ‚ΡŒ Π°Π½ΠΈΠΌΠ°Ρ†ΠΈΠΈ Π½Π°ΠΏΡ€ΡΠΌΡƒΡŽ зависит ΠΎΡ‚ частоты ΠΊΠ°Π΄Ρ€ΠΎΠ² Π°Π½ΠΈΠΌΠ°Ρ†ΠΈΠΈ ΠΈ измСряСтся Π² ΠΊΠ°Π΄Ρ€Π°Ρ… Π² сСкунду (fps). Π§Π΅ΠΌ Π²Ρ‹ΡˆΠ΅ это число, Ρ‚Π΅ΠΌ ΠΏΠ»Π°Π²Π½ΠΎΠ΅ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ ваша анимация Π΄ΠΎ Ρ‚ΠΎΡ‡ΠΊΠΈ.

ΠŸΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ Π±ΠΎΠ»ΡŒΡˆΠΈΠ½ΡΡ‚Π²ΠΎ экранов ΠΈΠΌΠ΅ΡŽΡ‚ частоту обновлСния 60 Π“Ρ†, максимальная частота ΠΊΠ°Π΄Ρ€ΠΎΠ², ΠΊ ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΡ‚Ρ€Π΅ΠΌΠΈΡ‚ΡŒΡΡ, составляСт 60 ΠΊΠ°Π΄Ρ€ΠΎΠ² Π² сСкунду (FPS) ΠΏΡ€ΠΈ Ρ€Π°Π±ΠΎΡ‚Π΅ с Π²Π΅Π±-Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π°ΠΌΠΈ. Однако большСС количСство ΠΊΠ°Π΄Ρ€ΠΎΠ² ΠΎΠ·Π½Π°Ρ‡Π°Π΅Ρ‚ большС ΠΎΠ±Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ, которая часто ΠΌΠΎΠΆΠ΅Ρ‚ Π²Ρ‹Π·Ρ‹Π²Π°Ρ‚ΡŒ Π·Π°ΠΈΠΊΠ°Π½ΠΈΠ΅ ΠΈ пропуски, Ρ‚Π°ΠΊΠΆΠ΅ извСстныС ΠΊΠ°ΠΊ ΠΏΡ€ΠΎΠΏΠ°Π΄Π°Π½ΠΈΠ΅ ΠΊΠ°Π΄Ρ€ΠΎΠ² ΠΈΠ»ΠΈ Π·Π°Π΅Π΄Π°Π½ΠΈΠ΅.

Если Ρƒ вас Π΅ΡΡ‚ΡŒ ΠΌΠΎΠ½ΠΈΡ‚ΠΎΡ€ с частотой обновлСния 60 Π“Ρ† ΠΈ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π΄ΠΎΡΡ‚ΠΈΡ‡ΡŒ 60 ΠΊΠ°Π΄Ρ€ΠΎΠ² Π² сСкунду, Ρƒ вас Π΅ΡΡ‚ΡŒ ΠΎΠΊΠΎΠ»ΠΎ 16,7 миллисСкунд (1000/60) для выполнСния ΠΊΠΎΠ΄Π° Π°Π½ΠΈΠΌΠ°Ρ†ΠΈΠΈ для Ρ€Π΅Π½Π΄Π΅Ρ€ΠΈΠ½Π³Π° ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΠΊΠ°Π΄Ρ€Π°. Π­Ρ‚ΠΎ Π½Π°ΠΏΠΎΠΌΠΈΠ½Π°Π½ΠΈΠ΅ ΠΎ Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎ Π²Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ ΠΏΠΎΠΌΠ½ΠΈΡ‚ΡŒ ΠΎΠ± ΠΎΠ±ΡŠΡ‘ΠΌΠ΅ ΠΊΠΎΠ΄Π°, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π²Ρ‹ ΠΏΡ‹Ρ‚Π°Π΅Ρ‚Π΅ΡΡŒ Π·Π°ΠΏΡƒΡΡ‚ΠΈΡ‚ΡŒ Π²ΠΎ врСмя ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ прохоТдСния Ρ†ΠΈΠΊΠ»Π° Π°Π½ΠΈΠΌΠ°Ρ†ΠΈΠΈ.

Π§Π΅ΠΌ отличаСтся requestAnimationFrame() ΠΎΡ‚ setInterval() and setTimeout()?

Π”Π°Π²Π°ΠΉΡ‚Π΅ ΠΏΠΎΠ³ΠΎΠ²ΠΎΡ€ΠΈΠΌ Π΅Ρ‰Ρ‘ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΠΎ Ρ‚ΠΎΠΌ, Ρ‡Π΅ΠΌ ΠΌΠ΅Ρ‚ΠΎΠ΄ requestAnimationFrame () отличаСтся ΠΎΡ‚ Π΄Ρ€ΡƒΠ³ΠΈΡ… ΠΌΠ΅Ρ‚ΠΎΠ΄ΠΎΠ², ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌΡ‹Ρ… Ρ€Π°Π½Π΅Π΅. Глядя Π½Π° наш ΠΊΠΎΠ΄ свСрху:

Вакой ТС код с использованиСм setInterval() :

Π’ Ρ‚ΠΎΠΌ числС врСмСнная ΠΌΠ΅Ρ‚ΠΊΠ°

Π­Ρ‚ΠΎ ΠΏΠΎΠ»Π΅Π·Π½ΠΎ, ΠΏΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ позволяСт Π·Π°ΠΏΡƒΡΠΊΠ°Ρ‚ΡŒ Π²Π΅Ρ‰ΠΈ Π² ΠΎΠΏΡ€Π΅Π΄Π΅Π»Ρ‘Π½Π½ΠΎΠ΅ врСмя ΠΈ Π² постоянном Ρ‚Π΅ΠΌΠΏΠ΅, нСзависимо ΠΎΡ‚ Ρ‚ΠΎΠ³ΠΎ, насколько быстрым ΠΈΠ»ΠΈ ΠΌΠ΅Π΄Π»Π΅Π½Π½Ρ‹ΠΌ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ вашС устройство. ΠžΠ±Ρ‰ΠΈΠΉ шаблон, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π²Ρ‹ Π±Ρ‹ использовали, выглядит ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π½ΠΎ Ρ‚Π°ΠΊ:

ΠŸΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΊΠ° Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π°ΠΌΠΈ

ΠŸΡ€ΠΎΡΡ‚ΠΎΠΉ ΠΏΡ€ΠΈΠΌΠ΅Ρ€

Π’ΠΎΠ·ΡŒΠΌΠΈΡ‚Π΅ Π±Π°Π·ΠΎΠ²Ρ‹ΠΉ HTML шаблон (Ρ‚Π°ΠΊΠΎΠΉ ΠΊΠ°ΠΊ этот).

Π˜ΡΡ‚ΠΎΡ‡Π½ΠΈΠΊ

Π’Π°ΠΉΠΌΠ΅Ρ€Ρ‹ JavaScript: всС Ρ‡Ρ‚ΠΎ Π½ΡƒΠΆΠ½ΠΎ Π·Π½Π°Ρ‚ΡŒ

ЗдравствуйтС, ΠΊΠΎΠ»Π»Π΅Π³ΠΈ. Π”Π°Π²Π½Ρ‹ΠΌ-Π΄Π°Π²Π½ΠΎ Π½Π° Π₯Π°Π±Ρ€Π΅ ΡƒΠΆΠ΅ ΠΏΠ΅Ρ€Π΅Π²ΠΎΠ΄ΠΈΠ»Π°ΡΡŒ ΡΡ‚Π°Ρ‚ΡŒΡ ΠΏΠΎΠ΄ авторством Π”ΠΆΠΎΠ½Π° Π Π΅Π·ΠΈΠ³Π° ΠΊΠ°ΠΊ Ρ€Π°Π· Π½Π° эту Ρ‚Π΅ΠΌΡƒ. ΠŸΡ€ΠΎΡˆΠ»ΠΎ ΡƒΠΆ 10 Π»Π΅Ρ‚, Π° Ρ‚Π΅ΠΌΠ° ΠΏΠΎ-ΠΏΡ€Π΅ΠΆΠ½Π΅ΠΌΡƒ Ρ‚Ρ€Π΅Π±ΡƒΠ΅Ρ‚ Ρ€Π°Π·ΡŠΡΡΠ½Π΅Π½ΠΈΠΉ. ΠŸΠΎΡΡ‚ΠΎΠΌΡƒ ΠΏΡ€Π΅Π΄Π»Π°Π³Π°Π΅ΠΌ ΠΈΠ½Ρ‚Π΅Ρ€Π΅ΡΡƒΡŽΡ‰ΠΈΠΌΡΡ ΠΏΠΎΡ‡ΠΈΡ‚Π°Ρ‚ΡŒ ΡΡ‚Π°Ρ‚ΡŒΡŽ Π‘Π°ΠΌΠ΅Ρ€Π° Π‘ΡƒΠ½Ρ‹, Π² ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ даСтся Π½Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ тСорСтичСский ΠΎΠ±Π·ΠΎΡ€ Ρ‚Π°ΠΉΠΌΠ΅Ρ€ΠΎΠ² Π² JavaScript (Π² контСкстС Node.js), Π½ΠΎ ΠΈ Π·Π°Π΄Π°Ρ‡ΠΈ Π½Π° Π½ΠΈΡ….

ΠΎΡ‚Π»ΠΎΠΆΠΈΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ скрипта javascript. image loader. ΠΎΡ‚Π»ΠΎΠΆΠΈΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ скрипта javascript Ρ„ΠΎΡ‚ΠΎ. ΠΎΡ‚Π»ΠΎΠΆΠΈΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ скрипта javascript-image loader. ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠ° ΠΎΡ‚Π»ΠΎΠΆΠΈΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ скрипта javascript. ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠ° image loader. Π­Ρ‚ΠΎΡ‚ ΠΌΠ΅Ρ‚ΠΎΠ΄ выполняСт ΠΊΠΎΠ΄(ΠΈΠ»ΠΈ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ), ΡƒΠΊΠ°Π·Π°Π½Π½Ρ‹ΠΉ Π² ΠΏΠ΅Ρ€Π²ΠΎΠΌ Π°Ρ€Π³ΡƒΠΌΠ΅Π½Ρ‚Π΅, асинхронно, с Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠΎΠΉ Π² delay миллисСкунд.

НСсколько нСдСль Π½Π°Π·Π°Π΄ я ΠΎΠΏΡƒΠ±Π»ΠΈΠΊΠΎΠ²Π°Π» Π² Π’Π²ΠΈΡ‚Ρ‚Π΅Ρ€Π΅ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΉ вопрос с ΠΎΠ΄Π½ΠΎΠ³ΠΎ собСсСдования:

Β«Π“Π΄Π΅ находится исходный ΠΊΠΎΠ΄ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΉ setTimeout ΠΈ setInterval? Π“Π΄Π΅ Π±Ρ‹ Π²Ρ‹ Π΅Π³ΠΎ искали? ΠŸΠΎΠ³ΡƒΠ³Π»ΠΈΡ‚ΡŒ нСльзя :)Β»

***ΠžΡ‚Π²Π΅Ρ‚ΡŒΡ‚Π΅ Π½Π° Π½Π΅Π³ΠΎ для сСбя, Π° ΠΏΠΎΡ‚ΠΎΠΌ Ρ‡ΠΈΡ‚Π°ΠΉΡ‚Π΅ дальшС ***

ΠšΠΎΠΌΡƒ-Ρ‚ΠΎ ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒΡΡ, Ρ‡Ρ‚ΠΎ это просто ΠΏΠ»ΠΎΡ…ΠΎΠΉ вопрос с собСсСдования – ΠΊΠ°ΠΊΠΎΠΉ Π²ΠΎΠΎΠ±Ρ‰Π΅ ΠΏΡ€ΠΎΠΊ Π·Π½Π°Ρ‚ΡŒ ΠΏΠΎΠ΄ΠΎΠ±Π½ΠΎΠ΅?! Π―, ΠΊΠ°ΠΊ JavaScript-Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊ, Π΄ΡƒΠΌΠ°ΡŽ Ρ‚Π°ΠΊ: прСдполагаСтся, Ρ‡Ρ‚ΠΎ Π²Ρ‹ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ это Π·Π½Π°Ρ‚ΡŒ, ΠΏΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ ΠΎΠ±Ρ€Π°Ρ‚Π½ΠΎΠ΅ ΠΌΠΎΠΆΠ΅Ρ‚ ΡΠ²ΠΈΠ΄Π΅Ρ‚Π΅Π»ΡŒΡΡ‚Π²ΠΎΠ²Π°Ρ‚ΡŒ, Ρ‡Ρ‚ΠΎ Π²Ρ‹ Π½Π΅ Π²ΠΏΠΎΠ»Π½Π΅ ΠΏΠΎΠ½ΠΈΠΌΠ°Π΅Ρ‚Π΅, ΠΊΠ°ΠΊ V8 (ΠΈ Π΄Ρ€ΡƒΠ³ΠΈΠ΅ Π²ΠΈΡ€Ρ‚ΡƒΠ°Π»ΡŒΠ½Ρ‹Π΅ ΠΌΠ°ΡˆΠΈΠ½Ρ‹) взаимодСйствуСт с Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π°ΠΌΠΈ ΠΈ Node.

Рассмотрим нСсколько ΠΏΡ€ΠΈΠΌΠ΅Ρ€ΠΎΠ² ΠΈ Ρ€Π΅ΡˆΠΈΠΌ ΠΏΠ°Ρ€ΠΎΡ‡ΠΊΡƒ Π·Π°Π΄Π°Ρ‡ Π½Π° Ρ‚Π°ΠΉΠΌΠ΅Ρ€Ρ‹, Π΄Π°Π²Π°ΠΉΡ‚Π΅?

Для запуска ΠΏΡ€ΠΈΠΌΠ΅Ρ€ΠΎΠ² ΠΈΠ· этой ΡΡ‚Π°Ρ‚ΡŒΠΈ ΠΌΠΎΠΆΠ½ΠΎ Π²ΠΎΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒΡΡ ΠΊΠΎΠΌΠ°Π½Π΄ΠΎΠΉ node. Π‘ΠΎΠ»ΡŒΡˆΠΈΠ½ΡΡ‚Π²ΠΎ рассмотрСнных здСсь ΠΏΡ€ΠΈΠΌΠ΅Ρ€ΠΎΠ² Ρ„ΠΈΠ³ΡƒΡ€ΠΈΡ€ΡƒΡŽΡ‚ Π² ΠΌΠΎΠ΅ΠΌ курсС Getting Started with Node.js Π½Π° Pluralsight.

ΠžΡ‚Π»ΠΎΠΆΠ΅Π½Π½ΠΎΠ΅ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ

Π’Π°ΠΉΠΌΠ΅Ρ€Ρ‹ – это Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ Π²Ρ‹ΡΡˆΠ΅Π³ΠΎ порядка, ΠΏΡ€ΠΈ ΠΏΠΎΠΌΠΎΡ‰ΠΈ ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… ΠΌΠΎΠΆΠ½ΠΎ ΠΎΡ‚ΠΊΠ»Π°Π΄Ρ‹Π²Π°Ρ‚ΡŒ ΠΈΠ»ΠΈ ΠΏΠΎΠ²Ρ‚ΠΎΡ€ΡΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ Π΄Ρ€ΡƒΠ³ΠΈΡ… Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΉ (Ρ‚Π°ΠΉΠΌΠ΅Ρ€ ΠΏΠΎΠ»ΡƒΡ‡Π°Π΅Ρ‚ Ρ‚Π°ΠΊΡƒΡŽ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ Π² качСствС ΠΏΠ΅Ρ€Π²ΠΎΠ³ΠΎ Π°Ρ€Π³ΡƒΠΌΠ΅Π½Ρ‚Π°).

Π’ΠΎΡ‚ ΠΏΡ€ΠΈΠΌΠ΅Ρ€ ΠΎΡ‚Π»ΠΎΠΆΠ΅Π½Π½ΠΎΠ³ΠΎ выполнСния:

Π’ этом ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π΅ ΠΏΡ€ΠΈ ΠΏΠΎΠΌΠΎΡ‰ΠΈ setTimeout Π²Ρ‹Π²ΠΎΠ΄ привСтствСнного сообщСния откладываСтся Π½Π° 4 сСкунды. Π’Ρ‚ΠΎΡ€ΠΎΠΉ Π°Ρ€Π³ΡƒΠΌΠ΅Π½Ρ‚ setTimeout β€” это Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠ° (Π² мс). Π― ΡƒΠΌΠ½ΠΎΠΆΠ°ΡŽ 4 Π½Π° 1000, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΠ»ΠΎΡΡŒ 4 сСкунды.

ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ Π°Ρ€Π³ΡƒΠΌΠ΅Π½Ρ‚ setTimeout – функция, Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΡ‚ΠΊΠ»Π°Π΄Ρ‹Π²Π°Ρ‚ΡŒΡΡ.
Если Π²Ρ‹ΠΏΠΎΠ»Π½ΠΈΡ‚ΡŒ Ρ„Π°ΠΉΠ» example1.js ΠΊΠΎΠΌΠ°Π½Π΄ΠΎΠΉ node, Node приостановится Π½Π° 4 сСкунды, Π° Π·Π°Ρ‚Π΅ΠΌ Π²Ρ‹Π²Π΅Π΄Π΅Ρ‚ привСтствСнноС сообщСниС (послС Ρ‡Π΅Π³ΠΎ послСдуСт Π²Ρ‹Ρ…ΠΎΠ΄).

ΠŸΡ€ΠΈ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠΈ example2.js ΠΊΠΎΠΌΠ°Π½Π΄ΠΎΠΉ node Ρ„Ρ€Π°Π·Π° β€œNode.js rocks” Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹Π²Π΅Π΄Π΅Π½Π° Π½Π° экран Ρ‡Π΅Ρ€Π΅Π· 2 сСкунды.

Π—Π°Π΄Π°Ρ‡Π° Π½Π° Ρ‚Π°ΠΉΠΌΠ΅Ρ€Ρ‹ #1

Π’ вашСм Ρ€Π΅ΡˆΠ΅Π½ΠΈΠΈ ΠΌΠΎΠΆΠ½ΠΎ ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΠΈΡ‚ΡŒ всСго ΠΎΠ΄Π½Ρƒ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ, ΡΠΎΠ΄Π΅Ρ€ΠΆΠ°Ρ‰ΡƒΡŽ встроСнныС Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ. Π­Ρ‚ΠΎ ΠΎΠ·Π½Π°Ρ‡Π°Π΅Ρ‚, Ρ‡Ρ‚ΠΎ мноТСство Π²Ρ‹Π·ΠΎΠ²ΠΎΠ² setTimeout Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Π±ΡƒΠ΄ΡƒΡ‚ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΎΠ΄Π½Ρƒ ΠΈ Ρ‚Ρƒ ΠΆΠ΅ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ.

Π’ΠΎΡ‚ ΠΊΠ°ΠΊ я Π±Ρ‹ Ρ€Π΅ΡˆΠΈΠ» эту Π·Π°Π΄Π°Ρ‡Ρƒ:

Π£ мСня theOneFunc ΠΏΠΎΠ»ΡƒΡ‡Π°Π΅Ρ‚ Π°Ρ€Π³ΡƒΠΌΠ΅Π½Ρ‚ delay ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ Π΄Π°Π½Π½ΠΎΠ³ΠΎ Π°Ρ€Π³ΡƒΠΌΠ΅Π½Ρ‚Π° delay Π² сообщСнии, Π²Ρ‹Π²ΠΎΠ΄ΠΈΠΌΠΎΠΌ Π½Π° экран. Π’Π°ΠΊΠΈΠΌ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ, функция ΠΌΠΎΠΆΠ΅Ρ‚ Π²Ρ‹Π²ΠΎΠ΄ΠΈΡ‚ΡŒ Ρ€Π°Π·Π½Ρ‹Π΅ сообщСния Π² зависимости ΠΎΡ‚ Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊΠΎΠ΅ Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠΈ ΠΌΡ‹ Π΅ΠΉ сообщим.

Π’Ρ‹ΠΏΠΎΠ»Π½ΠΈΠ² Ρ„Π°ΠΉΠ» solution1.js ΠΊΠΎΠΌΠ°Π½Π΄ΠΎΠΉ node, ΠΌΡ‹ Π²Ρ‹Π²Π΅Π΄Π΅ΠΌ Π½Π° экран трСбования Π·Π°Π΄Π°Ρ‡ΠΈ, ΠΏΡ€ΠΈΡ‡Π΅ΠΌ, ΠΏΠ΅Ρ€Π²ΠΎΠ΅ сообщСниС появится Ρ‡Π΅Ρ€Π΅Π· 4 сСкунды, Π° Π²Ρ‚ΠΎΡ€ΠΎΠ΅ β€” Ρ‡Π΅Ρ€Π΅Π· 8 сСкунд.

ΠŸΠΎΠ²Ρ‚ΠΎΡ€ΡΠ΅ΠΌ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ

Π’ΠΎΡ‚ ΠΏΡ€ΠΈΠΌΠ΅Ρ€ setInterval :

ΠŸΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ ΠΏΡ€ΠΈ Π²Ρ‹Π·ΠΎΠ²Π΅ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ Ρ‚Π°ΠΉΠΌΠ΅Ρ€Π° назначаСтся дСйствиС, это дСйствиС Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΠΎΡ‚ΠΌΠ΅Π½ΠΈΡ‚ΡŒ, ΠΏΡ€Π΅ΠΆΠ΄Π΅, Ρ‡Π΅ΠΌ ΠΎΠ½ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½.

Ѐункция setImmediate поддСрТиваСтся Π½Π΅ Π²ΠΎ всСх Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π°Ρ…. НС ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Π΅Π΅ Π² клиСнтском ΠΊΠΎΠ΄Π΅.

Π—Π°Π΄Π΅Ρ€ΠΆΠΊΠ° Ρ‚Π°ΠΉΠΌΠ΅Ρ€Π° – Π²Π΅Ρ‰ΡŒ Π½Π΅ гарантированная

Π’Ρ‹ Π·Π°ΠΌΠ΅Ρ‚ΠΈΠ»ΠΈ, Ρ‡Ρ‚ΠΎ Π² ΠΏΡ€Π΅Π΄Ρ‹Π΄ΡƒΡ‰Π΅ΠΌ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π΅ ΠΏΡ€ΠΈ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠΈ ΠΎΠΏΠ΅Ρ€Π°Ρ†ΠΈΠΈ с setTimeout послС 0 мс эта опСрация происходит Π½Π΅ сразу ΠΆΠ΅ (послС setTimeout ), Π° Ρ‚ΠΎΠ»ΡŒΠΊΠΎ послС Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ Π±ΡƒΠ΄Π΅Ρ‚ Ρ†Π΅Π»ΠΈΠΊΠΎΠΌ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ вСсь ΠΊΠΎΠ΄ скрипта (Π² Ρ‚ΠΎΠΌ числС, Π²Ρ‹Π·ΠΎΠ² clearTimeout )?

РазумССтся, Π½Π° ΠΏΡ€Π°ΠΊΡ‚ΠΈΠΊΠ΅ Ρ‚Π°ΠΊ Π΄Π΅Π»Π°Ρ‚ΡŒ ΠΎΡ‡Π΅Π½ΡŒ ΠΏΠ»ΠΎΡ…ΠΎ, Π½ΠΎ Π΄Π°Π½Π½Ρ‹ΠΉ ΠΏΡ€ΠΈΠΌΠ΅Ρ€ ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ‚ ΠΏΠΎΠ½ΡΡ‚ΡŒ, Ρ‡Ρ‚ΠΎ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠ° setTimeout – это Π½Π΅ Π³Π°Ρ€Π°Π½Ρ‚ΠΈΡ€ΠΎΠ²Π°Π½Π½ΠΎΠ΅, Π°, скорСС, минимальноС Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅. Π’Π΅Π»ΠΈΡ‡ΠΈΠ½Π° 500 мс ΠΎΠ·Π½Π°Ρ‡Π°Π΅Ρ‚, Ρ‡Ρ‚ΠΎ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠ° продлится ΠΌΠΈΠ½ΠΈΠΌΡƒΠΌ 500 мс. На самом Π΄Π΅Π»Π΅, скрипту потрСбуСтся Π³ΠΎΡ€Π°Π·Π΄ΠΎ большС Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ для Π²Ρ‹Π²ΠΎΠ΄Π° привСтствСнной строки Π½Π° экран. Π‘Π½Π°Ρ‡Π°Π»Π° Π΅ΠΌΡƒ придСтся Π΄ΠΎΠΆΠ΄Π°Ρ‚ΡŒΡΡ, ΠΏΠΎΠΊΠ° Π·Π°Π²Π΅Ρ€ΡˆΠΈΡ‚ΡΡ Π±Π»ΠΎΠΊΠΈΡ€ΡƒΡŽΡ‰ΠΈΠΉ Ρ†ΠΈΠΊΠ».

Π—Π°Π΄Π°Ρ‡Π° Π½Π° Ρ‚Π°ΠΉΠΌΠ΅Ρ€Ρ‹ #2

ΠΠ°ΠΏΠΈΡˆΠΈΡ‚Π΅ скрипт, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹Π²ΠΎΠ΄ΠΈΡ‚ΡŒ сообщСниС β€œHello World” Ρ€Π°Π· Π² сСкунду, Π½ΠΎ всСго 5 Ρ€Π°Π·. ПослС 5 ΠΈΡ‚Π΅Ρ€Π°Ρ†ΠΈΠΉ скрипт Π΄ΠΎΠ»ΠΆΠ΅Π½ вывСсти сообщСниС β€œDone”, послС Ρ‡Π΅Π³ΠΎ процСсс Node Π·Π°Π²Π΅Ρ€ΡˆΠΈΡ‚ΡΡ.

Подсказка: Π½ΡƒΠΆΠ΅Π½ счСтчик.

Π’ΠΎΡ‚ ΠΊΠ°ΠΊ я Π±Ρ‹ Ρ€Π΅ΡˆΠΈΠ» эту Π·Π°Π΄Π°Ρ‡Ρƒ:

Β«ΠšΡ‚ΠΎΒ» ΠΈΠΌΠ΅Π½Π½ΠΎ Π²Ρ‹Π·Ρ‹Π²Π°Π΅Ρ‚ ΠΎΡ‚Π»ΠΎΠΆΠ΅Π½Π½Ρ‹Π΅ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ?

ΠŸΡ€ΠΈ использовании ΠΊΠ»ΡŽΡ‡Π΅Π²ΠΎΠ³ΠΎ слова JavaScript this Π²Π½ΡƒΡ‚Ρ€ΠΈ ΠΎΠ±Ρ‹Ρ‡Π½ΠΎΠΉ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ, Π²ΠΎΡ‚ Ρ‚Π°ΠΊ Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€:

Π”Π°Π²Π°ΠΉΡ‚Π΅ ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΠΈΠΌ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ ΠΊΠ°ΠΊ свойство ΠΎΠ±ΡŠΠ΅ΠΊΡ‚Π°, Ρ‡Ρ‚ΠΎΠ±Ρ‹ стало Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ понятнСС:

Π’Π΅ΠΏΠ΅Ρ€ΡŒ, ΠΊΠΎΠ³Π΄Π° ΠΏΡ€ΠΈ Ρ€Π°Π±ΠΎΡ‚Π΅ с Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠ΅ΠΉ obj.whoCallMe ΠΌΡ‹ Π±ΡƒΠ΄Π΅ΠΌ Π½Π°ΠΏΡ€ΡΠΌΡƒΡŽ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ссылку Π½Π° Π½Π΅Π΅, Π² качСствС Π²Ρ‹Π·Ρ‹Π²Π°ΡŽΡ‰Π΅ΠΉ стороны Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹ΡΡ‚ΡƒΠΏΠ°Ρ‚ΡŒ ΠΎΠ±ΡŠΠ΅ΠΊΡ‚ obj (ΠΈΠ΄Π΅Π½Ρ‚ΠΈΡ„ΠΈΡ†ΠΈΡ€ΡƒΠ΅ΠΌΡ‹ΠΉ ΠΏΠΎ своСму id ):

ΠΎΡ‚Π»ΠΎΠΆΠΈΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ скрипта javascript. image loader. ΠΎΡ‚Π»ΠΎΠΆΠΈΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ скрипта javascript Ρ„ΠΎΡ‚ΠΎ. ΠΎΡ‚Π»ΠΎΠΆΠΈΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ скрипта javascript-image loader. ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠ° ΠΎΡ‚Π»ΠΎΠΆΠΈΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ скрипта javascript. ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠ° image loader. Π­Ρ‚ΠΎΡ‚ ΠΌΠ΅Ρ‚ΠΎΠ΄ выполняСт ΠΊΠΎΠ΄(ΠΈΠ»ΠΈ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ), ΡƒΠΊΠ°Π·Π°Π½Π½Ρ‹ΠΉ Π² ΠΏΠ΅Ρ€Π²ΠΎΠΌ Π°Ρ€Π³ΡƒΠΌΠ΅Π½Ρ‚Π΅, асинхронно, с Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠΎΠΉ Π² delay миллисСкунд.

ΠšΡ‚ΠΎ Π² Π΄Π°Π½Π½ΠΎΠΌ случаС Π²Ρ‹Π·Ρ‹Π²Π°ΡŽΡ‰ΠΈΠΉ?

ΠžΡ‚Π²Π΅Ρ‚ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΡ‚Π»ΠΈΡ‡Π°Ρ‚ΡŒΡΡ Π² зависимости ΠΎΡ‚ Ρ‚ΠΎΠ³ΠΎ, Π³Π΄Π΅ выполняСтся функция Ρ‚Π°ΠΉΠΌΠ΅Ρ€Π°. Π’ Π΄Π°Π½Π½ΠΎΠΌ случаС просто нСдопустима Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡ‚ΡŒ ΠΎΡ‚ Ρ‚ΠΎΠ³ΠΎ, ΠΊΡ‚ΠΎ β€” Π²Ρ‹Π·Ρ‹Π²Π°ΡŽΡ‰Π°Ρ сторона. Π’Ρ‹ ΡƒΡ‚Ρ€Π°Ρ‚ΠΈΡ‚Π΅ ΠΊΠΎΠ½Ρ‚Ρ€ΠΎΠ»ΡŒ Π½Π°Π΄ Π²Ρ‹Π·Ρ‹Π²Π°ΡŽΡ‰Π΅ΠΉ стороной, ΠΏΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ ΠΈΠΌΠ΅Π½Π½ΠΎ ΠΎΡ‚ Ρ€Π΅Π°Π»ΠΈΠ·Π°Ρ†ΠΈΠΈ Ρ‚Π°ΠΉΠΌΠ΅Ρ€Π° Π±ΡƒΠ΄Π΅Ρ‚ Π·Π°Π²ΠΈΡΠ΅Ρ‚ΡŒ, ΠΊΡ‚ΠΎ Π² Π΄Π°Π½Π½ΠΎΠΌ случаС Π²Ρ‹Π·Ρ‹Π²Π°Π΅Ρ‚ Π²Π°ΡˆΡƒ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ. Если ΠΏΡ€ΠΎΡ‚Π΅ΡΡ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ этот ΠΊΠΎΠ΄ Π² Node REPL, Ρ‚ΠΎ Π²Ρ‹Π·Ρ‹Π²Π°ΡŽΡ‰Π΅ΠΉ стороной окаТСтся ΠΎΠ±ΡŠΠ΅ΠΊΡ‚ Timeout :

ΠΎΡ‚Π»ΠΎΠΆΠΈΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ скрипта javascript. image loader. ΠΎΡ‚Π»ΠΎΠΆΠΈΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ скрипта javascript Ρ„ΠΎΡ‚ΠΎ. ΠΎΡ‚Π»ΠΎΠΆΠΈΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ скрипта javascript-image loader. ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠ° ΠΎΡ‚Π»ΠΎΠΆΠΈΡ‚ΡŒ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ скрипта javascript. ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠ° image loader. Π­Ρ‚ΠΎΡ‚ ΠΌΠ΅Ρ‚ΠΎΠ΄ выполняСт ΠΊΠΎΠ΄(ΠΈΠ»ΠΈ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΡŽ), ΡƒΠΊΠ°Π·Π°Π½Π½Ρ‹ΠΉ Π² ΠΏΠ΅Ρ€Π²ΠΎΠΌ Π°Ρ€Π³ΡƒΠΌΠ΅Π½Ρ‚Π΅, асинхронно, с Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠΎΠΉ Π² delay миллисСкунд.

ΠžΠ±Ρ€Π°Ρ‚ΠΈΡ‚Π΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅: это Π²Π°ΠΆΠ½ΠΎ лишь Π² случаС, ΠΊΠΎΠ³Π΄Π° ΠΊΠ»ΡŽΡ‡Π΅Π²ΠΎΠ΅ слово JavaScript this ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ Π²Π½ΡƒΡ‚Ρ€ΠΈ ΠΎΠ±Ρ‹Ρ‡Π½Ρ‹Ρ… Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΉ. ΠŸΡ€ΠΈ использовании стрСлочных Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΉ Π²Ρ‹Π·Ρ‹Π²Π°ΡŽΡ‰Π°Ρ сторона вас Π²ΠΎΠΎΠ±Ρ‰Π΅ Π½Π΅ Π΄ΠΎΠ»ΠΆΠ½Π° Π±Π΅ΡΠΏΠΎΠΊΠΎΠΈΡ‚ΡŒ.

Π—Π°Π΄Π°Ρ‡Π° Π½Π° Ρ‚Π°ΠΉΠΌΠ΅Ρ€Ρ‹ #3

ΠΠ°ΠΏΠΈΡˆΠΈΡ‚Π΅ скрипт, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π±ΡƒΠ΄Π΅Ρ‚ Π½Π΅ΠΏΡ€Π΅Ρ€Ρ‹Π²Π½ΠΎ Π²Ρ‹Π²ΠΎΠ΄ΠΈΡ‚ΡŒ сообщСниС β€œHello World” с Π²Π°Ρ€ΡŒΠΈΡ€ΡƒΡŽΡ‰ΠΈΠΌΠΈΡΡ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠ°ΠΌΠΈ. НачнитС с односСкундной Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠΈ, послС Ρ‡Π΅Π³ΠΎ Π½Π° ΠΊΠ°ΠΆΠ΄ΠΎΠΉ ΠΈΡ‚Π΅Ρ€Π°Ρ†ΠΈΠΈ ΡƒΠ²Π΅Π»ΠΈΡ‡ΠΈΠ²Π°ΠΉΡ‚Π΅ Π΅Π΅ Π½Π° сСкунду. На Π²Ρ‚ΠΎΡ€ΠΎΠΉ ΠΈΡ‚Π΅Ρ€Π°Ρ†ΠΈΠΈ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠ° Π±ΡƒΠ΄Π΅Ρ‚ 2 сСкунды. На Ρ‚Ρ€Π΅Ρ‚ΡŒΠ΅ΠΉ β€” Ρ‚Ρ€ΠΈ, ΠΈ Ρ‚Π°ΠΊ Π΄Π°Π»Π΅Π΅.

Π’ΠΊΠ»ΡŽΡ‡ΠΈΡ‚Π΅ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΡƒ Π² Π²Ρ‹Π²ΠΎΠ΄ΠΈΠΌΠΎΠ΅ сообщСниС. Π£ вас Π΄ΠΎΠ»ΠΆΠ΅Π½ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒΡΡ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π½ΠΎ Ρ‚Π°ΠΊΠΎΠΉ Π²Ρ‹Π²ΠΎΠ΄:

Hello World. 1
Hello World. 2
Hello World. 3
.

ΠžΠ³Ρ€Π°Π½ΠΈΡ‡Π΅Π½ΠΈΡ: ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Π½Π½Ρ‹Π΅ ΠΌΠΎΠΆΠ½ΠΎ ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΡΡ‚ΡŒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΏΡ€ΠΈ ΠΏΠΎΠΌΠΎΡ‰ΠΈ const. ΠŸΡ€ΠΈ ΠΏΠΎΠΌΠΎΡ‰ΠΈ let ΠΈΠ»ΠΈ var β€” нСльзя.

ΠŸΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ Π΄Π»ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΡΡ‚ΡŒ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠΈ Π² Π΄Π°Π½Π½ΠΎΠΉ Π·Π°Π΄Π°Ρ‡Π΅ – Π²Π΅Π»ΠΈΡ‡ΠΈΠ½Π° пСрСмСнная, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ setInterval здСсь нСльзя, Π½ΠΎ ΠΌΠΎΠΆΠ½ΠΎ Π²Ρ€ΡƒΡ‡Π½ΡƒΡŽ Π½Π°ΡΡ‚Ρ€ΠΎΠΈΡ‚ΡŒ ΠΈΠ½Ρ‚Π΅Ρ€Π²Π°Π»ΡŒΠ½ΠΎΠ΅ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ ΠΏΡ€ΠΈ ΠΏΠΎΠΌΠΎΡ‰ΠΈ setTimeout Π²Π½ΡƒΡ‚Ρ€ΠΈ рСкурсивного Π²Ρ‹Π·ΠΎΠ²Π°. ΠŸΠ΅Ρ€Π²Π°Ρ выполнСнная функция с setTimeout Π±ΡƒΠ΄Π΅Ρ‚ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΉ Ρ‚Π°ΠΉΠΌΠ΅Ρ€, ΠΈ Ρ‚Π°ΠΊ Π΄Π°Π»Π΅Π΅.

Π’ΠΎΡ‚ ΠΊΠ°ΠΊ ΠΌΠΎΠΆΠ½ΠΎ Π±Ρ‹Π»ΠΎ Π±Ρ‹ Ρ€Π΅ΡˆΠΈΡ‚ΡŒ эту Π·Π°Π΄Π°Ρ‡Ρƒ:

Π—Π°Π΄Π°Ρ‡Π° Π½Π° Ρ‚Π°ΠΉΠΌΠ΅Ρ€Ρ‹ #4

ΠΠ°ΠΏΠΈΡˆΠΈΡ‚Π΅ скрипт, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹Π²ΠΎΠ΄ΠΈΡ‚ΡŒ сообщСниС β€œHello World” с Ρ‚Π°ΠΊΠΎΠΉ ΠΆΠ΅ структурой Π·Π°Π΄Π΅Ρ€ΠΆΠ΅ΠΊ, ΠΊΠ°ΠΊ ΠΈ Π² Π·Π°Π΄Π°Ρ‡Π΅ #3, Π½ΠΎ Π½Π° этот Ρ€Π°Π· Π³Ρ€ΡƒΠΏΠΏΠ°ΠΌΠΈ ΠΏΠΎ 5 сообщСний, Π° Π² Π³Ρ€ΡƒΠΏΠΏΠ°Ρ… Π±ΡƒΠ΄Π΅Ρ‚ основной ΠΈΠ½Ρ‚Π΅Ρ€Π²Π°Π» Π·Π°Π΄Π΅Ρ€ΠΆΠΊΠΈ. Для ΠΏΠ΅Ρ€Π²ΠΎΠΉ Π³Ρ€ΡƒΠΏΠΏΡ‹ ΠΈΠ· 5 сообщСний Π²Ρ‹Π±ΠΈΡ€Π°Π΅ΠΌ ΠΈΡΡ…ΠΎΠ΄Π½ΡƒΡŽ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΡƒ Π² 100 мс, для ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅ΠΉ – 200 мс, для Ρ‚Ρ€Π΅Ρ‚ΡŒΠ΅ΠΉ – 300 мс ΠΈ Ρ‚Π°ΠΊ Π΄Π°Π»Π΅Π΅.

Π’ΠΎΡ‚ ΠΊΠ°ΠΊ Π΄ΠΎΠ»ΠΆΠ΅Π½ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ этот скрипт:

Π’ΠΊΠ»ΡŽΡ‡ΠΈΡ‚Π΅ Π·Π°Π΄Π΅Ρ€ΠΆΠΊΡƒ Π² Π²Ρ‹Π²ΠΎΠ΄ΠΈΠΌΠΎΠ΅ сообщСниС. Π£ вас Π΄ΠΎΠ»ΠΆΠ΅Π½ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒΡΡ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π½ΠΎ Ρ‚Π°ΠΊΠΎΠΉ Π²Ρ‹Π²ΠΎΠ΄ (Π±Π΅Π· ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠ΅Π²):

Hello World. 100 // ΠŸΡ€ΠΈ 100 мс
Hello World. 100 // ΠŸΡ€ΠΈ 200 мс
Hello World. 100 // ΠŸΡ€ΠΈ 300 мс
Hello World. 100 // ΠŸΡ€ΠΈ 400 мс
Hello World. 100 // ΠŸΡ€ΠΈ 500 мс
Hello World. 200 // ΠŸΡ€ΠΈ 700 мс
Hello World. 200 // ΠŸΡ€ΠΈ 900 мс
Hello World. 200 // ΠŸΡ€ΠΈ 1100 мс
.

Π˜ΡΡ‚ΠΎΡ‡Π½ΠΈΠΊ

Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ

Π’Π°Ρˆ адрСс email Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΠΏΡƒΠ±Π»ΠΈΠΊΠΎΠ²Π°Π½. ΠžΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ поля ΠΏΠΎΠΌΠ΅Ρ‡Π΅Π½Ρ‹ *