[javascript] 인덱스 / 반복 수에 따라 For 루프에서 간격 시간을 동적으로 변경하는 방법은 무엇입니까?

Program / 글쓴이

댓글을 달 수 없으므로이 게시물을 작성해야합니다. 정확히 1 초 또는 1000 밀리 초를 지연 / 대기하는 아래 코드가 있습니다.

let n = 5;
for (let i=1; i<n; i++)
{
  setTimeout( function timer()
  {
      console.log("hello world");
  }, i*1000 );
}

스 니펫 확장

그러나 고정 1000 밀리 초 대신 i * 1000 초 지연시킬 수 있으므로 대기는 반복 횟수에 따라 달라 집니까?

예를 들어, n = 5 인 경우 첫 번째 반복에서 1 초의 루프 지연을 원합니다. 2 초간 2 초간 반복됩니다. 최종 지연 시간은 5 초입니다.

답변

여기에 바로 1 초 후, 2 초 후, 3 초 후 등을 표시하는 기능이 있습니다. 특별한 수학이나 약속이 필요하지 않습니다.

const n = 5;
let cnt=0;

function show() {
  console.log("call "+cnt,"delay: ",cnt,"sec");
  cnt++;
  if (cnt > n) return; // we are done
  setTimeout(show, cnt*1000 ); // cnt seconds later
}
show()

스 니펫 확장

답변

이 작업은 약속, 반응 흐름 및 기타 멋진 도구 (아직 아무도 작업자를 사용하도록 제안하지 않았습니다!)로 해결할 수 있지만 약간의 산술로 해결할 수도 있습니다.

따라서 1s, 이전 one + 2s, 이전 one + 3s 등의 시퀀스 시간 초과를 원합니다. 이 순서는 1, 3, 6, 10, 15 …이며 공식은 a[n] = n * (n + 1) / 2입니다. 그것을 아는 것은…

let n = 6;
console.log(new Date().getSeconds());

for (let i = 1; i < n; i++) {
  setTimeout(function timer() {
    console.log(new Date().getSeconds());
  }, 1000 * i * (i + 1) / 2);
}

스 니펫 확장

답변

async / await (Promises)를 사용하여 코드를 직렬화 할 수 있습니다.

const waitSeconds = seconds => new Promise(resolve => setTimeout(resolve, seconds))

async function main () {
 let oldDate = new Date()
 let newDate

 /*
  * If you put 'await' inside the loop you can synchronize the async code, and simulate
  * a sleep function
  */
 for (let i=1; i<5; i++) {
    await waitSeconds(i*1000)
    newDate = new Date()
    console.log(`Loop for i=${i}, elapsed=${moment(newDate).diff(oldDate, 'seconds')} seconds`)
    oldDate = newDate
 }

 console.log('End')
}

main()
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>

스 니펫 확장

답변

질문 xD를 해독하는 데 시간이 걸렸지 만 이것이 당신이 원하는 것입니까?

매번 i * 1000 지연으로 console.log 를 계속 실행 합니다. 따라서 처음에는 1 초 길이 (1 * 1000)가되고 다음에는 2 초가됩니다.

let i = 0;
loop = () => {
  setTimeout(() => {
    console.log(new Date()); // for clarity
    i++;
    if (i < 10) {
      loop();
    }
  }, i * 1000)
};
loop();

스 니펫 확장

답변

루프는 타임 아웃 기능이 완료되기를 기다리지 않습니다. 따라서 루프가 실행될 때 각 인덱스에 대한 경고를 예약합니다.

인덱스에 따라 실행되지만 동시에 예약 된 기능을 사용할 수 있습니다. 3 초의 차이를 느낄 수 있습니다.

function test(i){
    setTimeout( function timer(){
        console.log("hello world" + i);
    }, i*3000);
}
for (let i=1; i<4; i++) {
   test(i);
}

답변

for 루프 대신 재귀 호출을 사용하십시오.

let i=1;
function a(i) {
  if (i > 5)
    return
  else
    b("message", i)
}

function b(s, f) {
  setTimeout(function timer() {
    console.log(s + " " + f + " seconds");
  }, f * 1000);
  a(++i);
}
a(i);

스 니펫 확장

답변