JavaScript Const
const는 JavaScript에서 상수를 선언하는 키워드입니다.
상수는 한 번 할당되면 그 값을 변경할 수 없는 변수를 의미합니다.
Cannot be Reassigned
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript const</h2>
<p id="demo"></p>
<script>
try {
const PI = 3.141592653589793;
PI = 3.14;
}
catch (err) {
document.getElementById("demo").innerHTML = err;
}
</script>
</body>
</html>JavaScript const
Must be Assigned
JavaScript const변수는 선언될 때 값을 지정해야 합니다.
// 맞음
const PI = 3.14159265359;
// 틀림
const PI;
PI = 3.14159265359;
When to use JavaScript const?
상수: const는 상수를 정의하는 데 사용됩니다.
상수는 프로그램 실행 동안 변경되지 않는 값을 나타내는데 사용됩니다.
예를 들어, 원주율 값이나 중력 상수 등이 이에 해당합니다.
const PI = 3.14159;고정된 설정 값: 설정 파일이나 환경 변수 같은 고정된 값을 나타내는 데 const를 사용할 수 있습니다.
const API_ENDPOINT = 'https://api.example.com';불변 객체: const는 배열이나 객체를 불변으로 만드는 데 사용될 수 있습니다.
const가 가리키는 참조는 변경할 수 없지만, 참조하는 객체의 속성이나 배열의 요소는 변경할 수 있습니다.
만약 객체 자체를 완전히 불변으로 만들고 싶다면 Object.freeze() 함수를 사용할 수 있습니다.
const person = Object.freeze({
name: 'John Doe',
age: 30
});모듈 또는 라이브러리의 참조: 라이브러리나 모듈을 import할 때, 그 참조는 대부분의 경우 변하지 않습니다.
따라서 이런 경우에 const를 사용하는 것이 일반적입니다.
const express = require('express');Constant Objects and Arrays
JavaScript에서 const를 사용하여 객체나 배열을 선언하면, 그 변수는 다른 객체나 배열로 재할당될 수 없습니다. 즉, const로 선언된 변수가 참조하는 메모리 주소는 변경될 수 없습니다.
그러나 객체나 배열의 내부 요소나 속성은 const 키워드에 영향을 받지 않습니다. 따라서 const를 사용하여 객체나 배열을 선언한 경우에도 내부 요소나 속성을 변경하는 것이 가능합니다.
// 객체 선언 후 값 변경
const obj = {name: 'John Doe', age: 30};
obj.name = 'Jane Doe'; // This is allowed
obj.age = 31; // This is allowed
obj.city = 'New York'; // This is allowed
console.log(obj);
// Output: {name: 'Jane Doe', age: 31, city: 'New York'}
// 배열 선언 후 요소 변경
const arr = [1, 2, 3];
arr[0] = 4; // This is allowed
arr.push(5); // This is allowed
console.log(arr);
// Output: [4, 2, 3, 5]참고 - {name: 'John Doe', age: 30} 은 JavaScript에서 객체(Object) 타입입니다.
JavaScript에서 객체는 키-값 쌍을 저장하는 컨테이너입니다. 이는 다른 언어에서의 map, hash, dictionary 등으로 알려져 있습니다.
그러나 const로 선언된 객체나 배열 자체를 다른 객체나 배열로 재할당하는 것은 허용되지 않습니다
obj = {name: 'Bob Smith', age: 40}; // Uncaught TypeError: Assignment to constant variable.
arr = [6, 7, 8]; // Uncaught TypeError: Assignment to constant variable.
Difference Between var, let and const
var, let, const는 모두 JavaScript에서 변수를 선언하는 키워드입니다. 그러나 각각은 서로 다른 스코프 규칙, 호이스팅 행동, 재할당 가능성 등에 따라 작동합니다.
var
함수 스코프: var는 함수 스코프를 가집니다. 즉, var로 선언된 변수는 그 변수가 선언된 함수의 전체 범위에서 접근할 수 있습니다.
호이스팅: var로 선언된 변수는 호이스팅됩니다. 이는 변수를 선언하기 전에도 그 변수에 접근할 수 있음을 의미합니다. 이 경우, 변수의 값은 undefined로 설정됩니다.
재할당: var로 선언된 변수는 재할당할 수 있습니다.
let
블록 스코프: let은 블록 스코프를 가집니다. 즉, let으로 선언된 변수는 그 변수가 선언된 블록 (중괄호 {}로 묶인 범위) 내에서만 접근할 수 있습니다.
호이스팅: let으로 선언된 변수는 호이스팅되지만, 선언 전에 접근하려고 하면 오류가 발생합니다. 이를 '임시 사각 지대(TDZ, Temporal Dead Zone)'라고 합니다.
재할당: let으로 선언된 변수는 재할당할 수 있습니다.
const
블록 스코프: const도 let과 같이 블록 스코프를 가집니다.
호이스팅: const로 선언된 변수도 호이스팅되지만, let과 마찬가지로 선언 전에 접근하려고 하면 오류가 발생합니다.
재할당: const로 선언된 변수는 재할당할 수 없습니다. 한 번 할당된 값은 변경할 수 없습니다. 그러나 객체 또는 배열과 같이 참조 타입을 const로 선언한 경우, 그 내부의 값을 변경하는 것은 가능합니다.
이러한 차이점들 때문에, 이 세 가지 키워드는 서로 다른 상황과 요구사항에 따라 사용됩니다. ES6 이후로는, 가능한 한 let과 const를 사용하는 것이 권장되며, var는 피하는 것이 좋습니다.
'FRONTEND > JAVASCRIPT' 카테고리의 다른 글
| JavaScript 튜토리얼 - JavaScript Data Types (0) | 2023.08.16 |
|---|---|
| JavaScript Operators (0) | 2023.08.04 |
| JavaScript 튜토리얼 - JavaScript Let (0) | 2023.07.24 |
| JavaScript 튜토리얼 - JavaScript Variables (0) | 2023.07.21 |
| JavaScript 튜토리얼 - JavaScript Syntax (0) | 2023.07.19 |