[JavaScript] 변수와 스코프

변수선언

 

var

console.log(title); // undefined
var title;

변수를 만들기도 전에  title 을 실행했는데도, 에러가 발생하는 것이 아닌 undefined 값이 출력됨.

선언이 나중에 되었으나, 선언부분이 올라가 있는 것 같은 현상을 호이스팅(Hoisting) 이라고 한다.

 

console.log(title); // undefined
var title = 'codeit';
console.log(title); // 'codeit'

선언 부분만 올라가기 때문에 해당 되는 값 자체는 그 이후에 접근이 가능하다.

 

 

let

console.log(title); // ReferenceError
let title;

let 은 변수선언 이전에 접근할 수 없어서 에러가 난다.

 

---

 

중복선언

 

var

var title = 'Codeit'; 
console.log(title); // 'Codeit'
var title = 'JavaScript'; 
console.log(title); // 'JavaScript'

title 변수를 두번 선언해도, 중복선언이 가능하다.

 

 

let

let title = 'Codeit';
console.log(title);
let title = 'JavaScript'; // SyntaxError
console.log(title);

중복선언이 불가능하다.

 

---

 

스코프 (전역변수, 지역변수)

 

var x = 3;  // Global Variable

function myFunc() {
     var y = 4;  // Local Variable
     console.log(`x in myFunc: ${x}`); // `x in myFunc: 3`
     console.log(`y in myFunc: ${y}`); // `y in myFunc: 4`
 }

 myFunc();
 console.log(x); // 3
 console.log(y); // Error

전역변수인 x 는 함수 안에서나 밖에서도 실행이 되지만, 지역변수는 y는 밖에서는 실행되지 않는다.

 

 

 

var 

 

var x = 3;

if (x < 4) {
    var y = 3;
}

for (var i = 0; i < 5; i++) {
    console.log(i);
}

console.log('x:', x);
console.log('y:', y);
console.log('i:', i);

그러나 var 키워드는 함수 단위로만 구분되기 때문에, 모두 전역변수로 평가된다. 따라서 어떤 조건문, 반복문에서 사용하는 전역변수는 만들수가 없다. 

 

 

let

let x = 3;

if (x < 4) {
    let y = 3;
}

for (let i = 0; i < 5; i++) {
  console.log(i);
}

console.log('x:', x);
console.log('y:', y); // Error
console.log('i:', i);

if문 안에서 선언된 y는 if 문 밖에서 사용할 수 없음.

 

var x;  // 함수 스코프 (function scope)
var y;  // 블록 스코프 (block scope)
const z;  // 블록 스코프 (block scope)