JavaScript 루프에서 지연 실행을 구현하는 방법은 무엇입니까?

Question

while 루프에 지연/휴면을 추가하고 싶습니다.

다음을 시도해 보았습니다.

alert('hi');

for(var start = 1; start < 10; start++) {
  setTimeout(함수 () {
    경고('안녕하세요');
  }, 3000);
}

첫 번째 경우만 정확합니다. alert('hi')를 표시한 후 3초 동안 기다린 다음 alert('hello')<를 표시합니다. /code>, 그러나 alert('hello')가 반복적으로 표시됩니다.

내가 원하는 것은 alert('hello')를 표시한 후 3초 후에 alert(' hello')<를 표시하기 전에 3초를 더 기다려야 한다는 것입니다. ;/코드> 등이 있습니다.

Answer 1

ES7부터 wait루프를 수행하는 더 좋은 방법이 있습니다.

으아악

엔진이 await 섹션에 도달하면 시간 초과를 설정하고 await部分时，它设置一个超时并暂停执行async函数비동기 함수의 실행을 일시 중지합니다. 그런 다음 시간 초과가 완료되면 해당 지점에서 실행이 계속됩니다. 이는 (1) 중첩 루프, (2) 조건부, (3) 중첩 함수를 연기할 수 있기 때문에 매우 유용합니다.

으아악

MDN 참조

이제 NodeJS와 최신 브라우저에서 ES7이 지원되지만 BabelJS를 사용한 트랜스파일을 사용하여 어디에서나 실행할 수 있습니다.

Answer 2

setTimeout() 이 함수는 비차단 기능이며 즉시 반환됩니다. 따라서 루프는 매우 빠르게 반복되며 빠르게 연속해서 3초 제한 시간을 트리거합니다. 그렇기 때문에 첫 번째 알림은 3초 후에 표시되고 다른 모든 알림은 지연 없이 계속해서 표시됩니다.

다음과 유사한 코드를 사용할 수 있습니다.

으아악