자바스크립트의 sleep() 메소드에 대해 이야기해 봅시다.

coldplay.xixi
풀어 주다: 2020-06-18 16:14:28
앞으로
2389명이 탐색했습니다.

자바스크립트의 sleep() 메소드에 대해 이야기해 봅시다.

많은 프로그래밍 언어에는 sleep(), delay() 및 기타 메서드가 있는데, 이를 통해 프로그램이 다음 작업을 수행하는 데 덜 불안해집니다. 미루고 잠시 기다려 보세요. 소프트웨어 개발을 하다 보면 이벤트가 발생하는지 확인하기 위해 몇 분씩 기다리는 등, 그런 기능이 필요한 기능을 자주 접하게 됩니다. JavaScript에는 특정 작업 실행 시간을 설정하는 setTimeout() 메서드가 있지만 작성 방법이 매우 보기 흉하고 콜백 함수가 필요합니다. sleep()delay()等方法,它能让我们的程序不那么着急的去执行下一步操作,而是延迟、等待一段时间。软件开发中经常会遇到需要这样的函数,比如等待几分钟去检查某一事件是否发生。JavaScript里有setTimeout()方法来实现设定一段时间后执行某个任务,但写法很丑陋,需要提供回调函数:

setTimeout(function(){ alert("Hello"); }, 3000);
로그인 후 복사

JavaScript Promise API是新出现了一个API,借助 Promise,我们可以对setTimeout函数进行改良,下面就是把setTimeout()封装成一个返回Promise的sleep()函数。

// https://zeit.co/blog/async-and-await
function sleep (time) {
  return new Promise((resolve) => setTimeout(resolve, time));
}

// 用法
sleep(500).then(() => {
    // 这里写sleep之后需要去做的事情
})
로그인 후 복사

你会发现,这种写法很优雅,很像其它编程语言里的延迟、等待函数。Promise API使我们避免传入回调函数,我们在实现中还使用了ES6中的箭头(arrow)函数。

这里需要提到的一个问题是,这个sleep()在执行的时候是“block”程序的继续执行的。它不是同步的。如果想让它同步执行,不妨碍执行之后的代码,我们可以使用 async/await 关键字。

(async function() {
  console.log('Do some thing, ' + new Date());
  await sleep(3000);
  console.log('Do other things, ' + new Date());
})();
로그인 후 복사

执行结果:

Do some thing, Mon Feb 23 2015 21:52:11 GMT+0800 (CST)  
Do other things, Mon Feb 23 2015 21:52:14 GMT+0800 (CST)
로그인 후 복사

你会发现,这一次,sleep()并没有阻碍第二个console的执行。

async/await 是ES7中的语法,目前还是处于试验阶段。那现在想用这个 async/await rrreee

JavaScript Promise API는 새로운 기능입니다. API는 Promise의 도움으로 setTimeout 함수를 개선할 수 있습니다. 다음은 setTimeout()sleep() 함수로 캡슐화하는 것입니다. Promise를 반환하는 것입니다.

rrreee이러한 작성 방식은 다른 프로그래밍 언어의 지연 및 대기 기능과 마찬가지로 매우 우아하다는 것을 알게 될 것입니다. Promise API를 사용하면 콜백 함수 전달을 피할 수 있으며 구현 시 ES6의 화살표 함수도 사용합니다.

여기서 언급해야 할 한 가지 문제는 이 sleep()이 실행될 때 프로그램의 지속적인 실행을 "차단"한다는 것입니다. 동기식이 아닙니다. 후속 코드 실행을 방해하지 않고 동기적으로 실행되도록 하려면 async/await 키워드를 사용할 수 있습니다. 🎜rrreee🎜실행 결과: 🎜rrreee🎜이번에는 sleep()이 두 번째 콘솔의 실행을 방해하지 않는 것을 확인할 수 있습니다. 🎜🎜하지만 async/await 는 ES7의 구문이며 아직 실험 단계에 있습니다. 지금 async/await 기능을 사용하려면 어떻게 해야 합니까? 더 높은 버전의 JavaScript를 ES5 코드로 컴파일할 수 있는 Google의 JavaScript 사전 컴파일러인 Traceur를 사용해 볼 수 있습니다. 이는 async/await에 대한 실험적 지원을 제공합니다(지정하려면 –experimental을 사용해야 함). 🎜🎜추천 튜토리얼: "🎜javascript 기본 튜토리얼🎜"🎜

위 내용은 자바스크립트의 sleep() 메소드에 대해 이야기해 봅시다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:webhek.com
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿