자바스크립트 settimeout 취소

JavaScript는 웹 애플리케이션에서 대화형 요소와 논리를 작성하는 데 사용할 수 있는 인기 있는 프로그래밍 언어입니다. 그중 settimeout은 JavaScript에 내장된 함수로, 일정 지연 후에 지정된 코드를 실행할 수 있습니다. 그러나 실행 중에 setTimeout 타이머를 취소해야 하는 경우가 있습니다. 이 기사에서는 JavaScript 언어를 사용하여 setTimeout 타이머를 취소하는 방법을 소개합니다.

1. setTimeout 함수의 기본 개요

setTimeout을 취소하는 방법을 소개하기 전에 먼저 setTimeout 함수의 기본 사용법과 개념을 살펴보겠습니다.

setTimeout 함수는 JavaScript의 전역 함수로 일정 시간이 지나면 지정된 코드의 실행을 지연시키는 것입니다. 구체적인 사용법은 다음과 같습니다.

setTimeout(function(){
  //执行的代码
},延迟的毫秒数)

그 중 function 은 지연되는 함수를 나타내며, 지연할 밀리초 수는 지연되는 시간을 밀리초 단위로 나타내는 숫자형 매개변수입니다. 예를 들어 500ms 이후에 함수를 실행하고 싶다면 다음 코드를 사용하면 됩니다:

setTimeout(function(){
  console.log('延迟500毫秒后执行的代码。')
},500)

2. setTimeout 타이머를 취소하기 위해clearTimeout 함수를 사용하는 방법

setTimeout 함수의 지연 시간이 너무 긴 경우 또는 확실하지 않은 경우 실행 중에 타이머를 취소해야 할 수도 있습니다. 이때 window 객체의clearTimeout 함수를 사용할 수 있습니다. 이 함수는 아직 실행되지 않은 setTimeout 함수의 일시 정지를 취소할 수 있습니다.

clearTimeout 함수는 다음과 같이 사용됩니다.

var timer = setTimeout(function(){
  console.log('延迟执行的代码。')
},3000)

//取消计时器
clearTimeout(timer);

위의 코드 예에서는 last1 타이머를 저장하기 위해 타이머라는 변수를 정의한 다음, 이 타이머를 취소하기 위해 ClearTimeout 함수를 사용합니다. 이렇게 하면 코드를 실행하기 전에 지연을 취소해야 하는 경우 ClearTimeout 함수를 사용할 수 있습니다.

3. setTimeout의 타이머는 취소할 수 있지만 내부 코드는 중지할 수 없습니다

clearTimeout 함수를 통해 타이머를 취소할 수 있지만 타이머 내에서 실행되는 코드는 중지할 수 없다는 점에 유의하세요. 즉, setTimeout 함수 내부에 항상 실행되는 함수를 정의하면 타이머가 취소되더라도 해당 함수가 완료될 때까지 해당 함수는 계속 실행된다는 의미입니다.

예를 들어 다음 코드 예제에서는 1초에 한 번씩 실행되는 setInterval 함수를 정의합니다. 타이머가 취소되더라도 함수는 한 번 실행된 후 중지됩니다.

var timer = setTimeout(function(){
  setInterval(function(){
    console.log('每秒执行一次的代码。')
  },1000)
},5000)

//取消计时器
clearTimeout(timer)

4. setTimeout과clearTimeout의 실제 적용

이제 setTimeout과clearTimeout의 실제 적용을 살펴보겠습니다.

실제 응용 프로그램에서 setTimeout 함수와clearTimeout 함수는 일반적으로 코드 실행 지연, 폴링이 필요한 코드 및 사용자에게 피드백 제공이 필요한 시나리오에 사용됩니다. 예:

1. 코드 실행 지연

실행 전에 일정 시간을 기다려야 하는 일부 시나리오에서는 사용자 입력 후 검색 프롬프트를 자동으로 완성하는 등 setTimeout 함수를 사용하여 이를 달성할 수 있습니다.

var timer;
function handleChange(){
  clearTimeout(timer)
  timer = setTimeout(function(){
    console.log('自动完成搜索提示')
  },500)
}

2. 폴링 코드

실시간 업데이트가 필요한 일부 시나리오에서는 setInterval 함수를 사용하여 폴링을 구현할 수 있습니다. 예를 들어 가끔씩 서버의 데이터를 업데이트합니다.

var timer = setInterval(function(){
  console.log('从服务器轮询数据')
},5000)

//取消轮询
clearInterval(timer)

3. 피드백 코드

사용자에게 피드백을 제공해야 하는 일부 시나리오에서는 setTimeout 함수를 사용할 수 있습니다. 예를 들어, 카운트다운, 대기 후 특정 작업 수행 등:

var count = 10;
var timer = setInterval(function(){
  count--
  console.log('还有' + count + '秒...')
  if(count == 0){
    clearInterval(timer)
    console.log('倒计时结束')
  }
},1000)

종합하면 setTimeout 함수와clearTimeout 함수는 매우 간단하지만 실제 응용 프로그램에서 큰 역할을 할 수 있어 웹 페이지를 더욱 기능적으로 만들고 인터페이스를 더 좋게 만듭니다. 더 친근한.

위 내용은 자바스크립트 settimeout 취소의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!