es6에서 타이머를 지우는 방법

두 가지 방법: 1. setTimeout 타이머를 지우려면 ClearTimeout()을 사용하세요. 구문은 "clearTimeout(타이머 반환 값)"입니다. 2. ClearInterval()을 사용하면 setInterval 타이머를 지울 수 있습니다. 구문은 "clearInterval(반환 값)"입니다.

이 튜토리얼의 운영 환경: Windows 7 시스템, ECMAScript 버전 6, Dell G3 컴퓨터.

JS의 타이머 두 개

window.setTimeout([function],[interval])window.setTimeout([function],[interval])

设置一个定时器，并且设定了一个等待的时间，当到达时间后，执行对应的方法，当方法执行完成定时器停止。

window.setInterval([function],[interval])

타이머를 설정하고 해당 시간에 도달하면 대기 시간을 설정합니다. 해당 메소드가 실행되고, 메소드 실행이 완료되면 타이머가 정지됩니다.

window.setInterval([function],[interval])

타이머를 설정하고 해당 시간에 도달하면 해당 메소드를 실행합니다.

메서드 실행이 완료되면 타이머는 타이머를 수동으로 지울 때까지 앞으로도 계속 다시 실행됩니다.

참고: setTimeout()은 코드를 한 번만 실행합니다. 여러 번 호출하려면 setInterval()을 사용하거나 코드 자체에서 setTimeout()을 다시 호출하도록 하세요.

타이머 반환 값

JS의 타이머에는 반환 값이 있으며, 반환 값은 현재 타이머를 나타내는 숫자입니다.

var timer1=window.setTimeout(function(){},1000);  //timer1->1 当前是第一个定时器
var timer2=window.setTimeout(function(){},1000);  //timer2->2` 当前是第二个定时器
var timer3=window.setTimeout(function(){},1000);   //timer3->3 当前是第三个定时器

타이머를 클리어하더라도 반환값은 클리어되지 않으며, 나중에 설정된 타이머의 반환값은 반환값을 기준으로 계속 역방향으로 흐른다는 점에 유의하세요.

타이머 지우는 방법

타이머가 제때 지워지지 않으면 메모리 오버플로가 발생할 위험이 있습니다. 따라서 타이머를 사용할 때는 적절한 시간에 타이머를 삭제하는 것을 고려해야 합니다.

• clear 타이머에는 두 가지 기능이 있습니다.

• setTimeout의 파괴 함수는clearTimeout입니다.

setInterval의 파괴 함수는clearInterval

setInterval 개체 또는 setTimeout 개체입니다. 이 두 타이머 개체는 window 개체로만 변경됩니다. 창 객체가 소멸될 때까지 스택에서 회수되지 않습니다. 변수의 포인터가 null을 가리키도록 변경하여 가비지 수집 시스템에 자동으로 재활용하도록 알릴 수 없습니다. window 객체가 닫히기 전에 window 객체의 스택 메모리에 있는 setInterval 객체를 파기하려는 경우에는clearInterval

clearTimeout(id_of_settimeout)

정의: 예약된 실행 기능을 차단/취소해야 합니다. setTimeout() 메소드에 의해 설정됩니다.

매개변수: id_of_settimeout은 setTimeout() 함수 호출 시 반환되는 ID 값입니다. 반환 식별자를 매개변수로 사용하면 setTimeout()에서 설정한 예약된 실행 작업을 취소할 수 있습니다.

• 참고:clearTimeout(id_of_setinterval) 메서드를 사용하려면 예약된 작업을 생성하고 실행할 때 전역 변수를 사용하세요.

  var myVar = setTimeout(function(){ alert("Hello"); }, 3000);
  clearTimeout(myVar);

제시간에 setTimeOut을 정리해야 합니까

function testTimeout () {
	console.log('1111')
	console.log(setTimeout(testTimeout, 3000));
}

위 코드는 testTimeout을 재귀적으로 호출하지만, setTimeout은 항상 setTimeout 객체로 생성됩니다. 비록 GC에 의해 재활용되지만 시간은 불확실합니다. 이는 더 위험하며 메모리 오버플로를 일으킬 수 있습니다.

따라서 setTimeout 객체가 지속적으로 생성되고 GC에 의해 재활용되지 않는 것을 방지하려면 각 setTimeout 전에clearTimeout을 호출해야 합니다.

var timeHandle = null;
function testTimeout () {
    if (timeHandle) {
    	// 调用之前，先清理，防止一直生成对象
    	// ps. setInterval 定时器也应该按这种模式处理
    	clearTimeout(timeHandle);
        timeHandle = null;
    }
	console.log('1111');
	console.log(timeHandle = setTimeout(testTimeout, 3000));
}

clearInterval(id_of_setinterval)

정의: setInterval() 함수로 설정된 예약된 실행 작업을 취소/중지할 수 있습니다.

매개변수: id_of_setinterval은 setInterval() 함수 호출 시 반환되는 ID 값입니다. 반환 식별자를 매개변수로 사용해야만 setInterval()에서 설정한 예약된 실행 작업을 취소할 수 있습니다.

• 참고: ClearInterval() 메서드를 사용하려면 예약된 작업을 생성하고 실행할 때 전역 변수를 사용하세요.

  var myVar = setInterval(function(){ myTimer() }, 1000);
  clearInterval(myVar);

setInterval을 시간에 맞춰 정리해야 합니까

function testInterval () {
	console.log('1111')
	console.log(setInterval(testInterval, 3000));
}

위 코드는 testInterval을 재귀적으로 호출하지만 setInterval 항상 setInterval 객체를 생성합니다. 비록 GC에 의해 재활용되지만 시간은 불확실합니다. 이는 더 위험하며 메모리 오버플로를 일으킬 수 있습니다.

따라서 setInterval 객체가 지속적으로 생성되고 GC에 의해 재활용되지 않는 것을 방지하려면 각 setInterval 전에clearInterval을 호출해야 합니다.

var timeHandle = null;
function testInterval () {
    if (timeHandle) {
    	// 调用之前，先清理，防止一直生成对象
    	clearInterval(timeHandle);
        timeHandle = null;
    }
	console.log('1111');
	console.log(timeHandle = setInterval(testInterval, 3000));
}

확장된 지식: setTimeout을 사용하여 setInterval 동작 시뮬레이션

일반적으로: setTimeOut()을 재귀적으로 사용하면 효과는 setInterval()을 사용하는 것과 동일합니다

• 이점:

• 단순화된 코드

동기 큐의 함수 호출 순서의 정확성과 setInterval 결함으로 인해 데이터 양이 많을 경우 비동기 큐의 함수 호출 실행 순서가 혼란스러워질 수 있습니다. 예를 들어, 이 함수의 실행이 완료되기 전에 다음 함수가 실행됩니다. 재귀에서는 함수의 다음 엔터티가 스택 공간에 재귀적으로 생성되고 현재 함수가 실행된 후에 호출됩니다. .

//实现的方法挺简单的 ，如下代码
//参数： 毫秒  需要执行的方法
function console1() {
    console.log(111);
    if(timer){
        clearTimeout(timer);
    }
    timer = setTimeout(function(){
        console1();
    }, 3000);
}
console1()

【관련 추천: javascript 비디오 튜토리얼

, 🎜web front-end🎜】🎜

위 내용은 es6에서 타이머를 지우는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!