5월의 막바지 입니다. 아~! 쿨럭.. 많은 분들이 왜 반말이냐고 그러하셔서...
존칭을 쓰기로 했습니다 ㅠㅠ
5월임에도 불구하고 많이 더운데... 오늘은 비온다고 우산도 준비해놨건만... 비는 안오고
덥기만 하군요. 사실 밖은 바람이 불어 시원한데... 사무실안은 덥습니다..
왜? 에어컨이 제자리쪽엔 안오걸랑요 ㅠㅠ
각설하고, 오늘의 주제에 대해서 이야기를 꾸려가보겠습니다.
오늘의 주제는 제목처럼 변수 scope입니다.. 주제는 변수의 스코프 이지만 전체적인 스코프에
대해서도 살짝 언급하겠습니다.
아시는 분들도 있겠지만, Javascript에서의 단위는 function입니다. 즉 function단위가 하나의 완벽한
구문입니다.
function단위로 실행이 되며, 메모리가 관리됩니다. 물론 위 규칙을 무시하는 구문도 존재합니다. 전문용어로 Closure라고 부르죠.
이 클로져에 대해서는 중급과정에서 심도 있게 다뤄보겠으니, 궁금하시더라도 참으시고 너무
궁금하시다 싶으면, 구글신의 도움을 받으시면 되겠습니다.
다시 본론으로 돌아와서, Javascript의 단위는 function이며 그 function안에서 메모리가 관리된다고
말씀드렸습니다.
function이 정의되고 실행되고, 더이상 참조가 되지 않으면 GC(Gabage Collector)에 의해 메모리에서
제거가 됩니다.
허나 모든것이 그렇게 되는건 아닙니다. 이름하여 "전역변수". 이놈은 특이하게도 function에
얽매이지 않고 page에 종속되어 있습니다. 전역변수가 선언되면 그 페이지가 갱신/소멸되기전까지는
메모리에 계속 상주하고 있는것이지요.
전역변수는 <script></script>안에서 function밖에 정의되어 있고 보통 아래와 같이 사용합니다
<script>
var global = "i'm a global vars";
</script>
또는 아래와 같이도 사용합니다.
<script>
global = "i'm a global vars";
</script>
두개가 무슨 차이냐구요? var로 선언을 한것과 안한것의 차이지요. 백문이 불여일견~! 다음 코드를 보시죠
<html>
<script>
msg = "I'm in the page";
function fncScope(){
var msg = "test";
alert(msg);
}
</script>
<body>
<script> fncScope(); </script>
</body>
</html>
자, 위의 스크립트를 실행하면 어떤결과가 나올까요? 답은 test가 맞습니다. 이유는 scope에 있습니다.
alert함수가 어디에 속해있나요? 그렇습니다. fncScope에 속해있습니다. 그렇기 때문에 자기의 소속인 fncScope의 msg변수를 우선시 합니다. 눈치가 빠르신 분들은 이미 알고 계셨을거라 생각합니다.
function 내부에서는 전역변수보다 지역변수가 우선합니다.
그럼 아래의 코드는 어떤 결과를 가져올까요?
<html>
<script>
msg = "I'm in the page";
function fncScope(){
alert(msg);
}
</script>
<body>
<script> fncScope(); </script>
</body>
</html>
그렇습니다. 위 내용과 일치하는 부분입니다. 비록 alert가 fncScope에 속해있지만 지역변수가 없기때문에 전역변수인 msg를 참조합니다. 답은 "I'm in the page"가 출력되죠 ^^
의외로 이번강좌는 좀 쉽게 느껴지는군요. ㅎㅎ 저만그런가요?
그럼 제가 문제 하나 내보겠습니다.
<html>
<script>
function fncScope(){
msg = "test";
}
function call(){
alert(msg);
}
</script>
<body>
<script>
fncScope();
call();
</script>
</body>
</html>
이 스크립트를 실행하면 어떤결과가 나올까요? 이 코드는 직접 실행해 볼 필요가 있습니다.
우선 집고 넘어갈것은
1. Javascript에서의 단위는 function이다.
2. function이 더이상 참조가 발생하지 않으면(참조값이 0이면) GC에 의해 메모리에서 제거된다
자... 자신있게 대답할 수 있나요? 답은 "test"가 출력이 됩니다.
제가 질문을 던지죠.
Q : msg는 분명 fncScope에 속해있는 변수인데 어떻게 다른 함수인 call에서 호출 할 수 있는것일까요?
스스로 답을 하실 수 있다면, 이강좌는 더이상 무의미해집니다 ^^ 하지만 혹시 하나라도 더 건질게 있을 수
있으니 조금만 참고 글을 읽어 내려가 봅시다.
우선 msg가 선언된 모습을 보면, var로 선언되지 않았습니다. 저~ 위에 제가 언급한 내용에 의하면 <script></script>사이에 var로 선언되거나 var 없이 선언되는 것은 "전역변수"라고 말씀드렸습니다.
이는 var없이 선언한 모든변수는 function안에 있거나 밖에있거나 전혀 구애받지 않습니다.
즉, msg를 포함한 fncScope가 실행됨에 따라 전역변수 msg가 생성되었고, 전역변수이므로 다른 함수인
call함수에서 msg를 출력할 수 있었던 것이지요. 이해하셨나요?
다시한번 말씀드리면 var를 사용하지 않고 선언한 변수는 무조건 전역변수가 됩니다. 어떤분들은 전역변수가 Javascript에서 별쓸모가 없다고 하시는 분들도 계십니다. 허나 이는 잘못된 생각입니다.
카운터라든지, 기타 다른작업에 꼭필요한 존재입니다.
그리고 전역변수이든 아니든 우리는 무조건 var를 사용하여 변수를 생성해서 써야하고, 반드시 전역변수와
지역변수를 구분하여 사용할줄 알아야 하겠습니다.
쉽지만 결코, 무시해서도 쉽게 지나쳐서도 안되는 부분입니다. Javascript에서 scope를 무시한다는건 Javascript를 제대로 배우고싶지 않다는 의미기도 하니까요.
절대 그냥 쉽게 생각치는 마세요.
이 scope 가 나중에 클로져의 개념에 많이 도입이되고 메모리 누수에 관련도 있는 부분입니다.
이러한 부분은 중급이상의 강좌에서 보실 수 있습니다. (인제 기초강좌인데 언제 중급까지 --;)
하루에 두개의 강좌를 썼더니 힘이 좀 드는군요..ㅎㅎ
오늘이 첨이라 긴장도 되고..ㅋㅋ 암튼 열심히 써보겠습니다. 누구를 위해서도 아니고 저 자신을 위해서
그럼 좋은밤 되세요 *^^*
posted by blankus
이 글의 트랙백 주소 :: http://www.blankus.net/trackback/3
