Front-End

vsoghlv@naver.com

자바스크립트 변수

변수는 값을 저장하고 참조하기 위해 사용한다. 변수에는 값 자체가 아닌 값의 위치가 저장되는데 이때 위치란 값이 위치하고 있는 메모리상의 주소를 뜻한다.

정리하자면 변수는 하나의 값을 저장하기 위해 확보한 메모리 공간 메모리 공간을 식별하기 위해 붙인 이름을 말한다.

값의 종류에 따라 필요한 데이터의 크기가 다르기 때문에 C 나 Java 와 같은 프로그래밍 언어에서는 변수의 타입을 지정해줘야 한다. 하지만 자바스크립트에서는 변수의 타입지정없이 변수에 값이 할당되는 과정에서 타입이 결정된다.

변수선언

자바스크립트에서 변수를 선언하는 방법은 3가지가 있는데 var, let, const 가 있다. let 과 const 는 es6 부터 추가된 방법으로 var 의 단점들을 보완하기 위해 추가되었다.

보통 우리가 변수를 선언할 때는 초기화를 같이 해주는데 var 의 경우 초기화 없이 변수를 선언만 해놓으면 초기에는 undefinde 가 할당된다.

var a;

//a = undefinde

보통 타입이 없는 자바스크립에서 이 변수에 어떤 타입의 값들을 넣을 것인지를 초기화를 통해 명시한다. let 은 var 과 같이 초기화 과정없이 선언만 하고 사용해도 되지만 var 과는 다르게 undefinde 가 할당되지 않기 때문에 사용 전 값을 할당해줘야 한다. 또한 const 는 초기화 과정이 없을 시 에러가 발생하므로 꼭 초기화 과정이 필요하다.

var st = "";//string 초기화
var num = 0;//number 초기화

스코프

var 과 let, const 는 변수의 유효범위 - scope 에서 차이가 있다. var 함수단위 스코프, let 과 const 는 블록단위 {} 스코프를 가지고 있다.

아래 예제를 보면 이해가 쉽다.

//let, const 블럭 단위 스코프
{
    const name = "sun";
    console.log(name);//sun 출력
}
console.log(name);//not defined

//밖에서 안으로
let age = 28;
{
    age++;
    console.log(age);//29
}
console.log(age);//29


//var 함수 스코프
var c = 0;
{
    c++;
    console.log(c);//1
}

{
    var d=0;
    console.log(d);//0
}

console.log(d);//0

var, let, const 의 차이

위에서 말했듯이 먼저 변수 범위에 있어 차이가 있다. 또한 재할당, 재선언 등에서 차이가 있는데 아래에 간단하게 정리해보겠다.

var - 함수단위 스코프, 재선언, 재할당 가능, 초기화 과정 필요없음( 초기화가 안될 시 undefinde 값 할당 )
let - 블록단위 스코프, 재선언 불가, 재할당 가능, 초기화 과정 필요없음 ( 초기화 안될 시 사용전 값 할당 필요 )
const- 블록단위 스코프, 재선언 불가, 재할당 불가, 초기화 과정 반드시 필요

변수의 값을 재할당 하면 기존의 값은 어떤 식별자와도 연결되어 있지 않게된다. 이런 불필요한 값들은 가비지 콜렉터에 의해 메모리에서 자동 해제됨으로써 메모리 누수를 방지한다. 이때 언제 해제될지는 알 수 없다.

네이밍 규칙

변수를 선언할 때는 네이밍 규칙을 지켜서 선언해야 한다.

  1. 특수문자를 제외한 문자, 숫자, _, $ 로 이루어져 있어야 한다.
  2. 단 첫글자는 문자, _, $ 로 시작해야 한다.
  3. 예약어는 식별자로 사용할 수 없다.
  4. 대소문자를 구분한다.

예약어는 프로그래밍 언어에서 사용되는 중이거나 사용될 예정인 단어를 말하는데 여기서 확인 할 수 있다.

식별자를 만들때 한글, 일본어 등도 사용할 수 있지만 권장하지는 않는다.

변수의 이름을 선언 할때는 변수의 존재목적을 이해하기 쉽게 의미를 명확하게 표현해줘야 코드의 가독성을 높일 수 있다.