[오늘의 JS] Variable, Const

Jessie H·2022년 3월 1일

Variable 변수

let chocolate = 'yummy'
console.log(chocolate)
{
let candy = 'sweet'
}

Global Scope

괄호 바깥에서 정의된 변수

let chocolate = 'yummy'
console.log(chocolate)

Block Scope

괄호 안에서 정의된 변수
괄호 바깥에서 괄호 안의 내용에 접근하려고 하면 볼 수 없다.

{
let candy = 'sweet'
}

var

보통 프로그래밍 언어에서 변수를 쓰려면 변수가 무엇인지 먼저 선언을 하고 입출력 등을 쓴다.
하지만 Javascript는 굉장히 유연한(?)언어라는 것을 var에서 알 수 있다.
var은 선언도 하기전에 값에 입력이 가능한 신기한 놈이다.
이런 현상을 var hoisting이라고 한다.

var hoisting

먼저 hoist의 의미를 살펴보자

hoist /verb/
to move from a lower position to a higher position
(출처: 캠브리지 영영사전)

사전의 의미를 토대로 var hoisting을 좀 더 정확하게 말하면 선언을 어디에 적든 선언이 적힌 위치에 상관없이 선언을 맨 위로 끌올하는 것이다.
(그래서 오류가 날 수 있어서 var을 잘 쓰지 않는 것이 좋다)

var의 또 다른 단점

var의 또 다른 단점은 바로 block scope와 Global Scope를 구분하지 않고 인식해서 개발할 때 헷갈릴 수 있다는 점이다.

그럼 뭘 쓰면 좋다? 'let' !!

ECMAScript 6에서 추가된 'let'을 대신 쓰면 된다.
let은 변수를 정의하는데 쓰인다.

파이썬에서 변수 a = 5 b = 3 정의했던거를
JS에서는 let a = 5, let b = 3 이렇게 쓰는 것!

참고로 메인 브라우저에서 모두 동작하기 때문에 let을 쓰는 것이 진짜 좋다
(물론 ~~버려진~~ 익스는 당근 적용이 되지 않음^^)

**그리고 let은 한번 정의 후에 다시 정의한 내용을 다른 내용으로 변경도 가능하다.

let a = '사과는';
let b = '맛있어';
console.log(a,b);

여기에 a를 '오렌지도'로 덮어씌우면

let a = '사과는';
let b = '맛있어';
console.log(a,b);
a = '오렌지도';
console.log(a,b)

const 상수

상수: 수식에서 변하지 않는 값

~~문과에 수학은 일도 관심없던 나라 모르는 것은 당연하지만..이런 용어 모를 때마다 괜히 자괴감들고 괴로워...나 한국인인데....ㅎㅎㅎㅎ~~

한마디로 const로 정의하면 값을 바꿀 수 없다.

**참고: const에서 상수 정의할 때 보통 대문자로 쓰는게 좋다고 한다
(출처: MDN)

//const로 재정의 시도
const today = 0301;
const today = 0505;
console.log(today);

//let으로 재정의 시도
const today = 0301;
let today = 0505;
console.log(today);

//var로 재정의 시도
const today = 0301;
var today = 0505;
console.log(today);

결과는 모두 이렇게 오류가 난다.
TODAY가 이미 정의 되어있어서 재정의를 할 수 없다는 뜻