728x90
반응형
✍️ Summary
var, let, const 특징
중복선언 | 재할당 | 스코프 (Scope) | 호이스팅 (Hoisting) | 전역객체 프로퍼티 |
|
var | 가능 | 가능 | 전역 스코프 (Global Scope) 함수 스코프 (Function Scope) |
호이스팅 시 undefined로 변수 초기화 (호이스팅 수행) |
할당 |
let | 불가능 | 가능 | 블록 스코프 (Block Scope) 브라켓 {} 내부에서 선언된 변수는 내부에서만 사용이 가능하다. |
선언단계 - TDZ - 초기화 단계 - 할당 단계로 분리되어 진행 (호이스팅 수행) |
undefined |
const | 불가능 | 불가능 | 블록 스코프 (Block Scope) 브라켓 {} 내부에서 선언된 변수는 내부에서만 사용이 가능하다. |
초기화 이전 접근 시 ReferenceError발생 (호이스팅 수행) |
undefined |
var [변수]
- 변수 선언부가 호이스팅 됨 (*호이스팅 : 변수 선언문만 제일 상단으로 끌어올리는 것)
- 같은 이름의 변수를 여러번 선언 가능
- 함수 스코프 (함수 안에서만 지역변수 쓸 수 있음)
📝 var 형태
var str="hello";
if(true){
var str2="world";
}
console.log(str2); //world
위의 코드는 if문 안에서 str2를 선언했지만 if문 밖에서도 변수가 유효한 것을 알 수 있습니다.
또한 같은 이름의 변수를 여러 번 선언하여도 오류가 나지 않습니다.
var str="hello";
var str="world";
console.log(str); //world
위와 같이 같은 이름의 변수를 두 번 선언하여도 오류가 나지 않고 값이 바뀌기만 합니다.
let [변수]
- 블럭 스코프 (블럭 안에서만 쓸 수 있음) *블럭 = {}
- 같은 이름의 변수를 선언할 수 없음
- 재할당 가능
📝 let 형태
let str='hello';
{
let str='world';
console.log(str); //world
}
console.log(str); //hello
let은 {}(block) 단위의 scope을 가집니다.
const [상수]
- 블럭 스코프 (블럭 안에서만 쓸 수 있음) *블럭 = {}
- 상수 선언시 사용
- 선언과 동시에 초기화 해야함
- 최초 초기화 후 값 변경 불가능
📝 const 형태
// 값 변경 불가능!
const c = 10;
c = 99;
console.log("c: "+c);
// > TypeError: Assignment to constant variable
// 선언 및 초기화 구분 불가능!
const f;
f = 100;
console.log("f: "+f);
// > SyntaxError: Missing initializer in const declaration
위와 같이 상수로 선언한 str의 값을 바꾸려고 하면 error가 납니다.
const는 {}(block) 단위의 scope을 가집니다.
728x90
반응형
'📌 Front End > └ JavaScript' 카테고리의 다른 글
[JavaScript] 자바스크립트 템플릿 리터럴(Template Literal) - 백틱(`), ${ }을 이용한 문자열 표기법 (1) | 2024.06.04 |
---|---|
[JavaScript] 자바스크립트 데이터 타입(Data Type) - 자료형/Array/Object (1) | 2024.06.04 |
[JavaScript] 로딩(Loading)바 만들기 (submit시 로딩 표현하기) (1) | 2023.04.23 |
[JavaScript] ==와 ===의 차이 (0) | 2023.03.13 |
[JavaScript] 자바스크립트 비동기 처리 (0) | 2023.03.13 |