setTimeout () 학습 노트

setTimeout()는 무엇입니까?

응, 그것은 타이머야.나의 가장 기초적인 이해는 이렇다. 바로 우리가 시간을 설정하고 이 시간이 되면 함수나 코드를 집행하는 것이다.

Syntax 구문

//       function，       ，  
var timeoutID = scope.setTimeout(function[, delay, param1, param2, ...]);
//       function，       
var timeoutID = scope.setTimeout(function[, delay]);
//       code   ，       
var timeoutID = scope.setTimeout(code[, delay]);

시간은 밀리초 단위이고 기본값은 0이며 0은 즉시 실행되지만 지연이 있을 수 있습니다.

즉각 집행이 아니라 지연이 있을 것이다.브라우저는 단일 라인으로 이벤트 순환을 기반으로 하기 때문에 대기열로 실행됩니다. setTimeout 특수한 대기열에 넣습니다.

setTimeout(function() {
    console.log('this is setTimeout');
}, 0);
var test = 'this is a text string';
console.log(test);
// this is a text string
// this is setTimeout

브라우저의 현재 대기열이 한가할 때만 특수 대기열에 있는 setTimeout 를 실행하기 때문에 console.log 실행이 느린 것을 발견할 수 있습니다.
또 현대 브라우저도 제한이 있어 간단하고 사용하기 쉬워 남용이 생겼다.대량의 플러그인 호출이 있으면 일정 횟수를 리셋한 후에 일정한 지연 제한이 있을 것이다.

set Timeout 실행 후 되돌아오는 값은 성형입니다.timeout ID입니다. 고정된 값이 아닙니다.clear Timeout () 를 사용하여 타이머를 제거할 수 있습니다.

타이머를 처음 사용할 때는 일반적으로 윤방도에서 사용된다.그들은 모두 이렇게 쓴다.

var timer = setTimeout(function(){
    //       setTimeout 
    //       clearTimeout(timer)
}, 2000);

그동안 왜 이러는지, 왜 이러는지 타이머를 지울 수 있었는지 잘 몰랐어요.원래 타이머가 실행된 후에 하나의 id를 되돌려줍니다. 이 id에 따라 서로 다른 타이머를 식별한 다음 setTimeout 타이머 id로 전송되면 삭제할 수 있습니다.

var timeout1 = setTimeout(function() {
    //
}, 1000);

var timeout2 = setTimeout(function() {
    //
}, 1000);

var timeout3 = setTimeout(function() {
    //
}, 1000);

console.log('timeout1---', timeout1);
console.log('timeout2---', timeout2);
console.log('timeout3---', timeout3);

// timeout1--- 1
// timeout2--- 2
// timeout3--- 3

실행 가능한 코드를 전송하는 것을 권장하지 않으며, 가능한 한 전송된function을 사용하여 실행하십시오

코드가 들어오면 clearTimeout()와 유사하게 안전하지 않은 문제가 발생할 수 있다.또 메모리 유출을 초래할 수 있다.

setTimeout(function test1() {
    var a = 1;
    console.log(a);
}, 0)

setTimeout((function test2() {
    var b = 1;
    console.log(b);
}).toString(), 0)

test1
// Uncaught ReferenceError: test1 is not defined
test2
// ... (    test2     )

eval()는 호출될 수 있기 때문에 실행이 끝나도 소각되지 않고 메모리를 계속 차지하기 때문에 test2라고 부른다.

간단한 비동기식 실행

우리는 일부 시간 소모된 코드를 리셋에 버리고 setTimeout 주지 않는다. 기본값은 0이기 때문에 브라우저가 한가할 때 실행한다.
그래도 적게 써라. 어쨌든 우리는 비동기적인 것을 실현할 수 있는 더 좋은 방법이 있다. 예를 들어 Promise

참고 자료

MDN 문서

전단 면접문제--setTimeout 깊이 탐구