함수 내에서 변수를 변경하는 중

Question

이미지의 속성을 변경하려고 시도했지만 setInterval() 메서드를 사용하여 기본값을 복원하려고했지만 함수 내부에서 변수를 사용하면 올바르게 작동하지 않으며 외부에 있어야합니다. 함수, 변수 값이 함수 내부에서 변경되지 않는 이유는 무엇입니까?

var Img1 = document.getElementById('img1'); 

setInterval(function(){ 
    var boolean= true; 
    if(boolean){ 
     Img1.src = "pic1.jpg"; 
     }else{ 
     Img1.src = "default.jpg"; 
    } 
    boolean= !boolean; 
} , 3000); 



// This one work properly! 

var Img1 = document.getElementById('img1'); 
var boolean= true; 

setInterval(function(){ 

    if(boolean){ 
     Img1.src = "pic1.jpg"; 
     }else{ 
     Img1.src = "default.jpg"; 
    } 
    boolean= !boolean; 
} , 3000); 

Answer 1

왜냐하면 함수가 호출 될 때마다 항상 부울 값이 참이기 때문입니다. 즉 true로 함수가 제일 먼저 설정 부울입니다 :

var boolean= true; 

부울는 사용자가 선택할 수있는 SRC 확인할 때까지 함수 내에서 수정되지 않습니다. 따라서 조건은 항상 Img.src를 pic1.jpg로 설정하는 동일한 결과에 도달합니다. 희망이 도움이됩니다!

Answer 2

setInterval()에 전송 된 함수 내에서 함수의 모든 반복 시작시 "부울"을 true로 설정합니다. 따라서 다음 코드는 항상 Img1.src = "pic1.jpg"를 설정합니다. 선 Img1.src = "default.jpg"; 반복의 모든 경우에 "부울"이 참이기 때문에 절대로 실행되지 않습니다.

setInterval(function(){ 
    var boolean= true; 
    if(boolean){ 
     Img1.src = "pic1.jpg"; 
    }else{ 
     Img1.src = "default.jpg"; 
    } 
    boolean= !boolean; 
} , 3000); 

당신은 당신이 반복 당 값을 setDefault이 호출자에게 범위가 그 부울 값을 수정할 수 있도록하는 기능에 setInterval을 포장하고자합니다. 예를 들어 :

const IMAGE_DEFAULT = "default.jpg"; 
const IMAGE_PIC1 = "pic1.jpg"; 

function StartImageInterval(img) { 
    var setDefault = true; 

    setInterval(function() { 
     img.src = ((setDefault) ? IMAGE_DEFAULT : IMAGE_PIC1); 
     setDefault = !setDefault; 
    }, 3000); 
} 

당신은 당신이 당신이 기능을 실행할 때마다 재 선언하고 있기 때문에

var Img1 = document.getElementById('img1'); 
StartImageInterval(Img1);