clearInterval()이 재귀 함수로 if/else 문에서 작동하지 않습니다.

Question

재생 시간과 작업 시간을 전환하는 카운트 다운을 작성하려고합니다. 그것은이 기능은 10 초 카운트 다운을 기록 콘솔하도록되어

var model = { 
intervalID: 0, 
status: 'work', 
workSeconds: 10, 
playSeconds: 10, 
} 

function startCountdown(){ 
if (model.status === 'work') { 

    model.countdown = model.workSeconds; 
    model.intervalID = setInterval(function(){ 

     model.countdown--; 
     if (model.countdown > 0) { 
      console.log('work', model.countdown); 
     } else { 
      model.status = 'play'; 
      clearInterval(model.indervalId); 
      startCountdown(); 
     } 
    }, 1000); 
} else if (model.status === 'play') { 

    model.countdown = model.playSeconds; 
    model.intervalID = setInterval(function(){ 
     model.countdown--; 
     if (model.countdown > 0) { 
      console.log('play', model.countdown); 
     } else { 
      model.status = 'work'; 
      clearInterval(model.indervalId); 
      startCountdown(); 
     } 
    }, 1000); 
} 
} 
startCountdown(); 

우리가 간격을 취소하고 '놀이'로 설정하고 다시 함수를 호출 0초을 ...에 도달 한 후 때 작업을 10 초 시작 일을 위해 카운트 다운이 0에 도달하면 플레이의 10 초 카운트 다운으로 전환하고 계속합니다.

아무런 간격도 제거되지 않고 두 간격이 서로 피드백 루프에서 계속 설정되는 것처럼 보입니다.

간격이 지워지지 않는 이유는 무엇입니까?

Answer 1

나는 오타가 있다고 생각합니다. clearInterval(model.indervalId);은 clearInterval(model.intervalID);이어야합니다.

이 경우에도 setTimeout을 사용하고 싶지만 이미 알고있는 것 같습니다.