javascript - js - settimeout이 완료되었거나 취소되었는지 확인

약속으로 할 수 있다고 생각합니다.

타이머를 생성하고 약속 안에 넣은 다음 그 약속을 배열에 넣습니다. 타이머가 실행되면 약속이 해결됩니다.

말 그대로 타이머를 작성하십시오.

  setTimeout(() => {
       resolve("True");
    }, 10000);

여기서 할 수있는 일은 이것입니다. 코드를 살펴볼 때는 promise.race와 함께 false를 반환하는 두 번째 약속을 사용하십시오.

let race = [timeouts[i],Promise.resolve("False") ]

약속이 해결되었는지 확인하려면 Promise.race를 사용하십시오. 둘 다 해결되면 Promise.race가 첫 번째 약속을 반환하고 "True"를 반환하기 때문에 작동합니다. 타이머가 여전히 꺼져 있으면 false를 반환합니다.

Promise.race(race).then((res, rej) => {
if(res === true) {
clearTimeout(timeouts[i]);
}
})

올바로 이해했는지 모르겠지만 이미 완료된 시간 초과를 제거하는 이유는 무엇입니까?

시간이 초과되면 배열에서 자신을 제거 할 수 있습니다.

timeouts.splice(timeouts.indexOf(timeout), 1);

var timeouts = [];
$(document).on('click', '.doTask', function() {
    var timeout = setTimeout(() => {
        doTaskAfter();
        timeouts.splice(timeouts.indexOf(timeout), 1); // <=== HERE
    }, 10000);
    timeouts.push(timeout);
});
$(document).on('click', '.cancelTasks', function() {
    var i = timeouts.length;
    while (i--) {
        clearTimeout(timeouts[i]);
        timeouts.splice(i, 1);
    }
});

중요하거나 중요하지 않은 한 가지는 clearTimeout 에 전화하는 것입니다  이미 지워지거나 완료된 시간 초과시 아무 작업도 수행하지 않으므로 시간을 추적하지 않아도됩니다.

그렇지 않으면 다음과 같이 상태를 추적 할 수 있습니다.

var timeouts = [];
$(document).on('click', '.doTask', function() {
    var timeout = { state: 'waiting' };
    timeout.id = setTimeout(() => {
        timeout.state = 'finished';
        doTaskAfter();
    }, 10000);
    timeouts.push(timeout);
});
$(document).on('click', '.cancelTasks', function() {
    var i = timeouts.length;
    while (i--) {
        if (timeouts[i].state !== 'finished' && timeouts[i].state !== 'canceled') {
            // i.e. timeouts[i].state is 'waiting'
            clearTimeout(timeouts[i].id);
            timeouts[i].state = 'canceled';
        }
        timeouts.splice(i, 1);
    }
});