======JavaScript Timing Events====== * description : JavaScript Timing Events * author : 오션 * email : shlim@repia.com * lastupdate : 2021-04-12 \\ ====Source of the article=== * [[https://www.w3schools.com/js/js_timing.asp|JavaScript Timing Events]] \\ %%JavaScript%%는 시간 간격을 두고 실행될 수 있습니다.\\ \\ 이를 __타이밍 이벤트__(Timing Events)라고 합니다.\\ =====Timing Events===== ''window'' 오브젝트를 사용하면 지정된 시간 간격으로 코드를 실행할 수 있습니다.\\ \\ 이러한 시간 간격을 타이밍 이벤트라고 합니다.\\ \\ %%JavaScript%%와 함께 사용하는 두 가지 주요 메서드는 다음과 같습니다.\\ * ''setTimeout(function, milliseconds'') * 지정된 시간 (밀리 초)을 기다린 후 함수를 실행합니다. * ''setInterval(function, milliseconds'') * ''setTimeout()''과 동일하지만 함수 실행을 계속 반복합니다. \\ ''setTimeout()'' 및 ''setInterval()''은 모두 %%HTML DOM Window%% 오브젝트의 메서드입니다.\\ =====The setTimeout() Method=====


window.setTimeout(function, milliseconds);

''%%window.setTimeout()%%'' 메서드는 window prefix없이 작성할 수 있습니다.\\ \\ 첫 번째 매개 변수는 실행할 함수입니다.\\ \\ 두 번째 매개 변수는 실행 전 밀리 초 수를 나타냅니다.\\ ====예제==== 버튼을 클릭하십시오. 3 초 동안 기다리면 페이지에 "Hello"라는 window 경고가 표시됩니다.\\

Click "Try it". Wati 3 seconds, and the page will alert "Hello".

=====How to Stop the Execution?===== ''%%clearTimeout()%%'' 메서드는 %%setTimeout()%%에 지정된 함수의 실행을 중지합니다.\\ \\


window.clearTimeout(timeoutVariable)

\\ ''%%window.clearTimeout()%%'' 메서드는 window prefix 없이 작성할 수 있습니다.\\ \\ ''%%clearTimeout()%%'' 메서드는 ''%%setTimeout()%%''에서 반환된 변수를 사용합니다.\\ \\


myVar = setTimeout(function, milliseconds);
clearTimeout(myVar);

\\ 함수가 아직 실행되지 않은 경우, ''%%clearTimeout()%%'' 메서드를 호출하여 실행을 중지 할 수 있습니다.\\ ====예제==== 위와 같은 예제이지만, "Stop" 버튼이 추가되었습니다.\\





    Click "Try it". Wati 3 seconds, and the page will alert "Hello".
    Click "Stop" to prevent the first function to execute.
    (You must click "Stop" before the 3 seconds are up.)

=====The setInterval() Method===== ''%%setInterval()%%'' 메서드는 주어진 시간 간격마다 주어진 함수를 반복합니다.\\ \\


window.setInterval(function, milliseconds);

\\ ''%%window.setInterval()%%'' 메서드는 window prefix 없이 작성할 수 있습니다.\\ \\ 첫 번째 매개 변수는 실행할 함수입니다.\\ \\ 두 번째 매개 변수는 각 실행 사이의 시간 간격 길이를 나타냅니다.\\ \\ 이 예제는 디지털 시계처럼 1 초에 한 번씩 "myTimer"라는 함수를 실행합니다.\\ ====예제==== 현재 시간을 표시합니다.





    A script on this page starts this clock:

\\ 1 초에는 1000 밀리 초가 있습니다.\\ =====How to Stop the Execution?===== ''%%clearInterval()%%'' 메서드는 %%setInterval()%% 메서드에서 지정된 함수의 실행을 중지합니다.\\ \\


window.clearInterval(timerVariable)

\\ ''%%window.clearInterval()%%'' 메서드는 window prefix없이 작성할 수 있습니다.\\ \\ ''%%clearInterval()%%'' 메서드는 ''%%setInterval()%%''에서 반환된 변수를 사용합니다.\\


myVar = setInterval(function, milliseconds);
clearInterval(myVar);

====예제==== 위와 같은 예제이지만, "Stop time"버튼을 추가했습니다.\\





  A script on this page starts this clock:

=====More Examples===== ====Another simple timing====





    
    Click on "Try it". I will display when two, four, and six seconds have passed.

=====A clock created with a timing event=====