변수 & 함수 스코프(scope)의 개념 이해 - 자바스크립트(Javascript)

변수, 함수의 스코프 개념 이해

스코프(scope)란 말 그대로 범위를 나타냅니다. 전역변수(Global Variable)와 지역변수(Local Variable)의 유효범위에 대해 살펴봅니다.

 

 

---

예를 들어 함수를 작성하고 실행할 때 함수 내에서 계산된 값을 굳이 retrun이라는 명령어로 전역에 반환하는 이유는 함수 내에서 정의된 변수는 지역변수이기 때문입니다. 전역변수로 정의된 변수는 함수 내외부 어디에서나 사용할 수 있지만 함수 내에서 정의된 변수 또는 함수(함수 내의 함수)는 해당 함수의 범위 안에서만 사용할 수 있는 점이 다릅니다.

 

var score=100, global_var=1;

function my_func(){

var score=50;

console.log(score, global_var);

}

my_func(); // 50, 1을 출력

console.log(score); // 100을 출력

 

스크립트 맨 위 var score는 전역으로 정의된 변수이며 100이란 값을 저장하고 있습니다. 함수 내에서의 score는 지역변수로 정의되었으며 50이란 값을 저장합니다. 함수 내에서 score를 출력하면 50을 나타내지만 함수 밖에서 score를 출력하게 되면 전역변수 score 값 100을 나타냅니다. 그리고 알아 둘 것은 전역변수 정의된 global_var는 함수 내에서도 사용할 수 있습니다.

 

특정 함수 내에서 다시 함수를 작성해도 변수와 마찬가지로 전역 함수와 지역 함수로 사용하게 됩니다.

 

function 함수명1{

자바스크립트 코드;

function 함수명2{

자바스크립트 코드;

}

}

 

상기와 같이 코드를 작성하게 되면 함수명1은 전역 함수, 함수명2는 지역 함수로 선언됩니다.

 

굳이 프로그래밍에 있어 전역과 지역을 구분하는 이유는 하나의 프로그램을 한 명의 개발자 개발할 때 보다 여러 명의 개발자가 동시다발적으로 개발에 참여할 때 서로 간의 변수나 함수 사용에 있어 충돌을 피하기 위해서입니다. 만약 a 개발자가 sum(임의의 변수명)이란 변수를 사용하고 있는데 b 개발자 역시 동일한 변수명을 사용한다면 서로 간에 충돌이 발생하여 의도치 않은 결과가 나올 수 있습니다. 이러한 개발자 간의 충돌을 전역과 지역을 구분함으로써 방지할 수 있습니다. 마지막으로 함수 선언과 동시에 실행하는 즉시 실행 함수(Immediately invoked function)에 대해 살펴봅니다.

 

(function (a) {

console.log(a);

})(2);

 

(function (b) {

console.log(b);

}(2));

 

상기 코드는 괄호의 위치만 살짝 다를 뿐 함수 선언과 동시에 실행하는 기능은 동일합니다.

 

이제 객체 생성자 함수에 대해 살펴봅니다. 자바스크립트에서 내장 객체를 생성할 때 new Obeject() 메서드를 사용하여 객체를 생성하였는데 함수를 통해서도 객체를 생성할 수 있습니다.

 

객체 생성 함수 사용	객체 생성자 함수 선언
var person1 = new Object(); person1.name = "baik"; person1.age = 45; person1.info = function() { console.log("name:"+this.name); console.log("age:"+this.age); } person1.info();	function person2(name, age){ this.name=name; this.age=age; this.info=function (){ console.log("name:"+this.name); console.log("age:"+this.age); } this.info(); } person2("kim",22); person2("park",17);

---

이제 자바스크립트에서 사용되는 함수 문법과 전역, 지역의 개념에 대해 살펴봤습니다. 그리 어렵지 않습니다. 제가 자바스크립트를 학습하게 된 계기는 웹에서 사용자들로부터 어떠한 데이터를 입력받을 때 파이썬으로는 한계가 있었습니다. 데이터의 가공, 추출은 파이썬 판다스로, 사용자 정보 입력은 자바스크립트로 진행할 예정입니다. 잘 될지 모르겠지만 단도직입! 시작하겠습니다.