[JavaScript] 전역변수와 지역변수

전역변수와 지역변수

변수는 중괄호(함수 블록){ }를 기준으로 변수 선언 위치에 따라 전역변수와 지역변수로 나뉜다.
지역 변수는 블록 내에서만 사용 가능한 반면, 전역변수는 블록 바깥이나 안쪽이나 자유롭게 사용 가능하다.

---

전역변수와 지역변수의 선언 위치

이렇게 블록 { }에 의해 변수 범위가 달라지는 것을 변수의 scope(스코프)라고 한다.

전역변수	지역변수
var 변수; function 함수 () { }	function 함수 () { var 변수; }

예시 01

아래의 예시에서는 함수 블록 내의 kor 변수가 전역변수이며 getScore() 함수를 호출하게 되면 kor 변수 값이 90에서 100으로 변경된다.

var kor = 90;
function getScroe() {
    kor = 100;   // 전역변수 : 바깥 var kor = 90을 100으로 변경한거임
    console.log(kor);   // 그래서 100 출력됨
}
getScore();
console.log(kor);   // 100

예시 02

아래의 예시에서는 함수 블록 내의 kor 변수를 var로 정의했고, var로 선언된 변수는 지역변수가 되어 블록 바깥의 전역변수 kor과 다른 별도의 변수가 된다.

var kor = 90;    // 전역변수
function getScroe() {
    var kor = 100;      // 지역변수
    console.log(kor);   // 100
}
getScore();
console.log(kor);   // 여기선 전역변수가 출력되므로 90

예시 03

함수 블록 안의 지역변수는 반드시 var로 선언해줘야 하며 함수의 지역변수는 함수 블록 바깥에서 사용 불가능하다!

function getScroe() {
    var kor = 100;
    console.log(kor);   // 100
}
getScore();
console.log(kor);   // error

---

함수 레벨 스코프와 블록 레벨 스코프

var는 함수 블록 내에서만 지역변수가 존재하며 블록이나 제어문 블록에서는 지역변수가 존재하지 않는다.
let과 const는 블록이나 제어문 블록에서도 지역변수 선언 가능하다.

예시1 - var :

var num = 10;
{
    var num = 20;       // num은 전역변수
    console.log(num);   // 20 출력
}
console.log(num);       // 20 출력

예시2 - let :

let num = 10;
{
    let num = 20;       // num은 지역변수
    console.log(num);   // 20 출력
}
console.log(num);       // 10 출력

예시3 - const :

const num = 10;
{
    const num = 20;       // num은 지역변수
    console.log(num);   // 20 출력
}
console.log(num);       // 10 출력

예시4 - var + if문 :

var num = 10;
if(num === 10) {        // num이 숫자 10과 완전히 성질까지 일치하는가?
    let sum = 20;       // 전역변수
}
console.log(sum);       // 20 출력

예시5 - let + if문 :

sum 변수를 블록 밖에서도 호출 가능하나 제어문 블록 안에서 let으로 선언된 변수는 지역변수이기 때문에 제어문 블록 밖에서 호출 불가능함.

let num = 10;
if(num === 10) {        // num이 숫자 10과 완전히 성질까지 일치하는가?
    let sum = 20;       // 지역변수
}
console.log(sum);       // error 출력

---

함수의 지역/전역변수 + 블록의 지역변수

// 함수의 전역변수
var sum1 = 10;
function add1() {
    sum1 = 20;
}
add1();
console.log('전역' + sum1);     // 20

// 함수의 지역변수
var = sum2 = 30;
function add2() {
    var sum2 = 40;
    console.log('지역' + sum2); // 40
}
add2();
console.log('전역' + sum2);     // 30

// 블록의 지역변수
var num1 = 50;
if(num1 === 50) {
    var num1 = 60;
}
console.log('전역' + num1);     // 60
let num2 = 70;
if(num2 === 70) {
    let num2 = 80;
    console.log('지역' + num2); // 80
}
console.log('전역' + num2);     // 70