inflearn logo
강의

Khóa học
Chia sẻ kiến thức

Học JavaScript bằng cách tạo trò chơi trên web

Chọn thẻ HTML bằng JS

setTimeout 질문

280

777uku2184

38 câu hỏi đã được viết

0

강의 따라하면서 for문 안에 setTimeout을 썼는데 지금은 정상작동을 하는 것 같습니다.

자바스크립트가 업데이트 된 것인가요??

javascript

Câu trả lời 4

0

jjanmo

지나가는 자린이입니다 ^^;; for문에서 사용하신 변수 스코프 차이 때문에 발생한 현상같습니다. 올려주신 코드에서는 for(let i ~~~)라고하셨기때문에 let의 스코프가  { }안에서 적용되어서 값이 알맞게 할당(?)되어서 가능한거같습니다. 선생님께서 사용하신 코드는 for(var i~~~)라고 쓰셨기 때문에 var의 스코프가 function(여기서는 window 전역)이 됩니다. 그래서 결국 비동기함수가 실행되는 시점에는 i가  마지막값으로 변해있기때문에  안되는 거고요. 즉, for문에서 변수 선언에 있어서 var냐 let이냐에 따라서 달라진것같네요... 저도 자바스크립를 배우는 입장이라...틀린부분있다면 지적해주시면 감사하겠습니다. 

ps1.혹시 이해가 잘안되셨다면,,,

https://www.daleseo.com/js-var-issues/ 

여기부분 참고하시길...(이렇게 사이트 올려도 되는지모르겠지만 저도 사이트를 참조해서요 ;;)

ps2. 이렇게 해결하는 방법도 있네요...

    for (var i = 0; i < winNum.length; i++) {
      let num = winNum[i];
      setTimeout(() => {
        const ball = document.createElement("div");
        ball.textContent = num;
        win.appendChild(ball);
      }, 1000 * (i + 1));
   }

0

777uku2184

궁금해서 그러는데 답변부탁드립니다. ㅠㅠ

0

777uku2184

const win = document.querySelector(".win");
const bonus = document.querySelector(".bonus");

const candidate = Array(45)
  .fill()
  .map((e, i) => i + 1);

const shuffle = [];

while (candidate.length > 0) {
  const value = candidate.splice(
    Math.floor(Math.random() * candidate.length),
    1
  )[0];
  shuffle.push(value);
}

const winNum = shuffle.slice(0, 6).sort((p, c) => p - c);
const bonusNum = shuffle[shuffle.length - 1];

console.log(winNum);

for (let i = 0; i < winNum.length; i++) {
  setTimeout(() => {
    const ball = document.createElement("div");
    ball.textContent = winNum[i];
    win.appendChild(ball);
  }, 1000 * (i + 1));
}

setTimeout(() => {
  const bonusBall = document.createElement("div");
  bonusBall.textContent = bonusNum;
  bonus.appendChild(bonusBall);
}, 7000);

전체 코드입니다.

이렇게 하니까 당첨숫자도 1초마다 차례대로 나오면서 정상작동이 됩니다....

정상작동이 돼서 저도 당황했습니다.

0

zerocho

아뇨 정상작동을 하면 안 됩니다. 어떤 코드를 사용하셨나요?

iput 입력글자 제한에러...

0

226

0

리팩토링 관련 질문입니다. (자스스톤)

0

275

1

카드 짝맞추기 react-native

0

340

0

필터 메소드 관련 질문입니다.

0

336

1

가위바위보 게임 질문드립니다~

0

202

1

자바스크립트 기초에 관해서 질문있습니다.

0

205

1

질문입니다.

1

357

1

이벤트 리스너 안에서 동작 질문드립니다.

0

323

2

질문드립니다.

0

188

0

안녕하세요 깊은 복사 부분에서 질문 있습니다.

0

243

1

document.createElement('')함수에서

0

244

2

안녕하세요 클로저 부분에서 질문 있습니다.

0

278

1

안녕하세요 제로초님

0

736

1

끝말잇기 화면에 출력 반복문을 이용해서 횟수 제한

0

243

1

안녕하세요 제로초님 질문있습니다

0

314

1

안녕하세요 강의 정말 잘시청하고있습니다.

0

272

3

?

0

149

1

틱택토 게임에서 게임이 끝나고

0

564

1

9 곱하는게 이해가 안 되요~

0

171

1

지뢰찾기 에러잡아내기에서 질문있습니다!

0

453

4

지뢰찾기 에러 관련 질문!

0

479

3

리팩토링에 관한 질문입니다.

0

239

2

Array/Object spread

0

202

1

지뢰찾기게임에서 Math.random() 질문

0

219

1