Javascript setInterval clearInterval 간단한 예제가 작동하지 않습니까?

Question

매우 간단한 JS setInterval 및 clearInterval 예제가 작동하지 않습니다. 그것이 작동하지 않으며, 그 이유는 내가 알고 싶은 이유 근본적인 이유가있을 가지고있다 :이 예에서

var automessage; 

function turnON() //executed by onclick event A 
{ 
    var automessage = setInterval(function(){ something() }, 2000); 
} 

function turnOff() //executed by onclick event B 
{ 
    clearInterval(automessage); 
} 

function something() 
{ 
    //pulls instant messages 
} 

, 최종 사용자가 시간 제한 간격 프로세스를 시작하기 버튼을 클릭, 다른를 클릭 버튼을 클릭하여 시간 간격 프로세스를 중지 한 다음 다시 버튼을 클릭하여 프로세스를 다시 시작하십시오. 기본적으로 온/오프 스타일의 프로세스입니다.

이것은 작동하지 않으며 이유를 파악하려고합니다. 나는 Stackoverflow에서 제공되는 수백 가지의 다른 예제를 모두 사용할 수 있지만 실제로 켜기/끄기 스타일의 프로세스가 필요하다. setInterval은 언제든지 켜고 끌 수 있어야합니다.

정말 도움을 주셔서 감사합니다. 또한 Jquery 라이브러리를 사용하지 않습니다.

Answer 1

automessage은 전역 변수 및 로컬 변수로 두 번 선언됩니다. 시도 :

function turnON() //executed by onclick event A 
{ 
    automessage = setInterval(function(){ something() }, 2000); 
} 

Answer 2

var automessage; 

function turnON() { //executed by onclick event A 
    automessage = setInterval(function(){ something() }, 2000); 
} 
function turnOff() { //executed by onclick event B 
    clearInterval(automessage); 
} 
function something() { 
    //pulls instant messages 
} 

이 코드는 작동합니다. turnON 함수의 컨텍스트에서 항상 초기화하는 automessage이라는 새 변수가 전역 변수를 난독 화하기 때문에 사용자가 작동하지 않습니다. var을 사용하지 않으면 전역 변수 automessage을 무시합니다.

automessage은 전역 변수이므로 다른 스크립트에서 편집 할 수 있습니다. IMHO는 가능하지 않아야하므로, 을 클로저로 사용하여을 캡슐화하고 을automessage 변수 (모듈화 된 패턴과 같은 것으로, 아래 참조)로 설정하는 것이 좋습니다. 당신의 클릭 핸들러 내부 buttonModule.turnON, buttonModule.turnOFF :

var buttonModule = (function() { 
    var _automessage; 
    function turnON() { //executed by onclick event A 
     _automessage = setInterval(_something, 2000); 
    } 
    function turnOFF() { //executed by onclick event B 
     clearInterval(_automessage); 
    } 
    function _something() { 
     //pulls instant messages 
    } 
    return { 
     turnON: turnON, 
     turnOFF: turnOFF 
    }; 
})(); 

그런 다음 당신은이 방법을 사용할 수 있습니다.

Answer 3

변화

var automessage = setInterval(function(){ something() }, 2000); 

turnON()에서

automessage = setInterval(function(){ something() }, 2000); 

에