가희의자기개발블로그

var 과 let 그리고 const 본문

프론트엔드/JavaScript+JQuery

var 과 let 그리고 const

가희gahui 2020. 7. 9. 19:09
반응형

JavaScript에서 변수를 선언하는 방식은 var과 let 그리고 const가 있다.

 

 이 세개를 비교하기 위해서는 몇가지 고려해야할 사항이 있다. 바로

 

  1. 변수 값의 변환
  2. 변수의 유효범위
  3. 호이스팅

1_변수 값의 변환

JavaScript를 사용할 때 흔히 말하는 큰 문제점은 변수 선언의 방식이다.

 

var을 이용할 경우 할당되는 값이 유동적으로 변경될 수 있다. 예를 들어

var name = "Gahui";
var name ="Minho";

console.log(name) // Minho

name이라는 변수를 두번 선언 했음에도 불구하고 에러가 뜨지 않고 2번째 변수가 첫번째 변수 값을 덮어 씌워 버린다.

 

이런 문제점들로 인해 let과 const는 var와 같은 선언 방식을 막고 있다. 

let name = "gahui";
let name = "Minho";
console.log(name);
output: Identifier 'name' has already been declared

let과 마찬가지로 const도 변수 재할당이 안된다는 특징이 있다.

 

let과 const의 차이는 변수의 immutable 여부이다. 

let은 변수에 재할당이 가능하지만, const는 변수 재선언, 재할당 모두 불가능 하다.

 

2_변수의 유효범위

먼저 var는 기본적으로 function Scope

let과 const는 block scope를 가지게 된다.

 

var foo = "This is String.";
if(typeof foo === 'string'){
	var result = true;
} else {
  var result = false;
}

console.log(result);    // result : true

let과 const

var foo = "This is String.";
if(typeof foo === 'string'){
	const result = true;
} else {
  const result = false;
}

console.log(result);    // result : result is not defined
반응형

'프론트엔드 > JavaScript+JQuery' 카테고리의 다른 글

Scope  (0) 2020.07.09
Hoisting  (0) 2020.07.09
스타일 핵심 내용  (0) 2020.07.09
스타일 소개  (0) 2020.07.08
on("click") vs click()  (0) 2020.07.08
Comments