자바스크립트 변수와 상수 : let, const

천둥상어

·

2023. 11. 28. 06:20

반응형

자바스크립트 변수와 상수 let, const

 

"자바스크립트에서 변수와 상수는 데이터를 저장하고 관리하는 데에 사용되는 핵심 요소입니다. 
변수와 상수의 개념, 선언 방법, 사용 예시 등에 대해 알아보겠습니다."

 

변수(Variable)

변수는 값을 저장하고 참조하기 위한 식별자입니다. 

자바스크립트에서 변수를 선언할 때는 'var', 'let' 키워드를 사용합니다.

 

변수 선언 및 할당

변수는 값을 할당하고 새로운 값으로 다시 할당 할 수 있습니다.

과거 ES5(ECMAScript) 까지 변수 키워드로 'var' 가 사용되었습니다. ES6 부터 현재까지는 'let' 을 사용 합니다.

ES6부터 let를 사용하는 이유는 여기를 참고 하세요. (var의 대체인 let의 도입과 그 이유)

let x; // 선언은 했지만 값은 없음.
console.log(x) // 결과 : undefined

let y = 10 // 선언과 동시에 값 10을 할당
console.log(y) // 결과 : 10

y = 20 // 변수 y에 값 20을 할당
console.log(y) // 결과 : 20

 

상수(Constant)

상수는 한 번 값을 할당하면 그 값을 변경할 수 없는 수입니다.

상수는 주로 변하지 않는 값에 사용되며, 코드의 가독성을 높이고 실수를 방지하는 데에 도움을 줍니다.

 

상수 선언 및 할당

상수는 'const' 키워드로 선언과 동시에 값을 할당해야 합니다.

// 상수는 선언과 동시에 값을 할당해 줘야 한다.
const day; // 에러 발생

// 상수는 재할당이 불가능 하다.
const day = "Monday";
day = "FriDay" // 에러 발생

// 가독성을 위해 대문자로 표시하는 경우가 많다.
const PI = 3.14;
const MAX_WIDTH = 800;
const API_KEY = "your_api_key";

 

배열과 객체의 값 변경

'const' 를 사용하여 배열 또는 객체를 선언하면 해당 변수는 더 이상 새로운 값을 할당할 수 없습니다. 

하지만 배열이나 객체 내부의 요소 또는 속성은 변경될 수 있습니다. 

이것은 'const' 가 변수의 불변성을 강제하는 것이 아니라 변수가 참조하는 메모리 주소의 불변성을 강제한다는 것입니다.

이러한 특성은 변수가 참조하는 배열 또는 객체의 구조를 변경하지 않으면서 내부의 데이터를 조작할 수 있게 해주기 때문에 유용합니다.

 

  • 배열
const numbers = [1, 2, 3];
numbers.push(4); // 허용됨
console.log(numbers); // [1, 2, 3, 4]

numbers = [5, 6, 7]; // 에러: 재할당이 허용되지 않음

 

  • 객체
const person = { name: 'John', age: 30 };
person.age = 31; // 허용됨
console.log(person); // { name: 'John', age: 31 }

person = { name: 'Jane', age: 25 }; // 에러: 재할당이 허용되지 않음

 

 

마무리

변수와 상수는 자바스크립트에서 데이터를 다루는 핵심 개념입니다. 
변수는 값이 변할 수 있고, 상수는 변하지 않는 값을 나타냅니다. 
이들을 적절히 활용하여 코드를 작성하면 가독성이 향상되고 유지보수가 용이해집니다. 

반응형