[JS] Variable

변수란?

Variable

• 하나의 값을 저장하기 위해 확보한 메모리 공간 자체
• 그 메모리 공간을 식별하기 위해 붙인 이름

변수가 필요한 이유

• 컴퓨터는 메모리를 사용해 데이터를 기억
• 각 메모리 셀은 고유의 메모리 주소(=메모리 공간의 위치)를 가짐
• 기억하고 싶은 값을 메모리에 저장하고, 저장된 값을 읽어 재사용하기 위해 사용
  • 변수명을 통해 변수에 저장된 값의 의미를 명확히 할 필요가 있음 (변수명을 잘 짓자!)
• 개발자가 직접 메모리 주소를 접근/제어하지 않고, 변수를 통해 안전하게 값에 접근

Terms

const result = 10 + 20

• 변수명 - 메모리 공간에 저장된 값을 식별할 수 있는 고유한 이름 (result)
  • =식별자 - 메모리 상에 존재하는 어떤 값을 식별할 수 있는 이름
    (ex. 변수, 함수, 클래스 등의 이름)
  • 선언(declaration)에 의해 자바스크립트 엔진에 식별자의 존재를 알림
  • 실행 컨텍스트 - 변수명과 모든 식별자는 실행 컨텍스트에 등록되어, 자바스크립트 엔진이 코드를 평가할 수 있도록 관리
• 변수 값 - 변수에 저장된 값 (30)
• 할당(assignment) - 변수에 값을 저장하는 것
  • 재할당 - 이미 값이 할당되어 있는 변수에 새로운 값을 또다시 할당하는 것
    • 저장된 메모리 공간을 지우는 것이 아니라, 새로운 메모리 공간을 확보 후 새로운 값을 저장
    • 사용하지 않는 불필요한 값들은 가비지 컬렉터에 의해 메모리에서 자동 해제됨
• 초기화(initialization) - 변수가 선언된 이후 최초로 값을 할당하는 것
  • 초기화 단계를 거치지 않으면, garbage value가 나올 수 있음
• 참조(reference) - 변수에 저장된 값을 읽어 들이는 것

변수 선언

변수를 생성하는 것

• 값을 저장하기 위한 메모리 공간을 확보
• 변수명과 메모리 공간의 주소를 연결해 값을 저장할 수 있게 준비
• var, let, const 키워드를 사용해 변수를 선언
• 변수 선언(및 모든 선언문)은 런타임이 아니라 그 이전 단계에서 실행됨 (=변수 호이스팅)

var

• 블록 레벨 스코프를 지원하지 않고, 함수 레벨 스코프를 지원
• 선언&초기화 단계가 동시에 진행됨
  • 선언 단계: var score; var name, score;
  • 초기화 단계: 메모리 공간에 undefined가 암묵적으로 할당되어 초기화
• 이미 값이 할당된 변수에 새로운 값을 재할당 할 수 있음

const

• 한번만 할당할 수 있는 변수를 선언
• 상수를 표현할 수 있다

네이밍 규칙

• 변수명은 대소문자를 구별
• 문자, 숫자, 언더스코어, 달러기호 포함 가능
• 예약어(function, class 등) 금지
• 의미를 명확히 표현하여 가독성 높이기
• Naming convention
  • camelCase - 변수나 함수 이름에 자주 사용
  • snake_case
  • PascalCase - 생성자 함수, 클래스 이름에 자주 사용

값 할당

변수에 값을 대입/저장

• 할당 연산자 =을 사용
• 우변의 값을 좌변의 변수에 할당
• 값의 할당은 소스코드가 순차적으로 실행되는 시점인 런타임에 실행됨

변수 선언 & 할당

: 단축표현일 뿐이지, 자바스크립트는 선언과 할당을 2개의 문으로 나누어 각각 실행

const userId = 1;
const userName = 'suuhyeony';
const user = { id: 1, name: 'suuhyeony' };
const users = [
  { id: 1, name: 'suuhyeony' },
  { id: 2, name: 'dotgae' }
]

참고 - 모던 자바스크립트 Deep dive