[SeSAC] 선언과 할당

변수, 상수 선언

선언

데이터를 담을 공간에 이름을 작성하는 과정

할당

선언된 이름에 데이터를 담는 과정

 

변수(變數, 변하는 수, variable)

let 키워드

• 선언된 변수에 할당된 값이 변할 때
• 데이터 재할당이 가능하다

let city = 'seoul'
num = 'busan'

상수(常數, 항상 같은 수, 변하지 않은 수, constrant)

const 키워드

• 선언된 상수에 할당된 값이 변하지 않을 때
• 데이터 재할당이 불가능하다
  • 재할당 시 TypeError가 발생한다.

const num = 1
num = 4 // 에러 발생

TypeError: Assignment to constant variable.
// 타입에러 : 상수 변수에 할당

 

공통 사항

• 동일한 이름으로 재선언이 불가하다

---

네이밍 규칙

• 알파벳, 숫자, 밑줄(_), 달러 기호($)만 사용할 수 있다.
• 변수는 숫자로 시작할 수 없다.
• 변수 이름은 대소문자를 구분한다.
• 예약어(키워드) 변수 이름으로 사용할 수 없다.
  • 예시 : Number String let, var, cosnt 등

💡 참고) 네이밍에서 공백(띄어쓰기) 표현 방식

• 카멜 케이스 (Camel Case)
  • 자바스크립트에서 가장 흔히 사용되는 방식이다.
  • 첫 단어는 소문자로 시작하고, 이후 단어는 대문자로 시작한다.
  • 예: firstName, lastName, isActive, calculateTotalPrice
• 파스칼 케이스 (Pascal Case)
  • 주로 클래스나 생성자 함수에 사용된다.
  • 모든 단어의 첫 글자를 대문자로 시작한다.
  • 예: Person, CustomerRecord, TaxCalculator
• 스네이크 케이스 (Snake Case)
  • 단어 사이를 언더스코어(_)로 구분한다.
  • python 언어에서 사용된다.
  • 예: first_name, last_name, is_active
• 케밥 케이스 (Kebab Case)
  • 단어 사이를 대쉬(-)로 구분한다.
  • 예 : btn-danger, d-flex

템플릿 리터럴

문자열을 백틱(`)으로 감싸고, 특정 위치에 변수를 삽입할 수 있다.

• 백틱은 키보드의 esc 밑에 위치해 있다.(물결모양과 함께 있음)

let name = '철수';
let message = `안녕하세요 ${name}라고 합니다`;
//  let message = "안녕하세요 "+ name + "라고 합니다"; // 연산 기호를 사용하여 복잡해보인다.
console.log(message);

---

var 키워드

최근에는 권장하지 않는 방법이다.

var를 통한 선언은 재할당, 재선언이 가능하며 호이스팅이 되어 코드의 가독성을 해친다.

 

호스스팅

코드는 상단에서 하단으로 동작한다.

상단에서 먼저 사용하고 하단에 var 키워드를 사용했다면

마치 선언된 것처럼 사용되지만, 값은 undefined이다.

console.log(name); // undefined (호이스팅 발생)

var name = '철수';

console.log(name); // 철수

 

---

JavaScript는 1994년 'Netscape Navigator' 이름으로 출시하여 1995년 Java의 인기로 인해 지금의 이름이 되었다.

그만큼 오래되고 발전해왔기 때문에 과거 자료를 보게된다면 이해를 위해 알고 있으면 좋은 지식들이 있다.

 

이 글의 var와 같은 존재를 의미한다.