[모던 JS Deep Dive] 4장 - 변수

4.1 변수란 무엇인가? 왜 필요한가?

 - 데이터 관리

 - 메모리 사용하여 데이터 기억, CPU 사용하여 연산

 - 메모리는 메모리 셀의 집합체

 - 각 셀은 고유의 메모리 주소를 가짐 (셀 하나는 1바이트 크기)

 - JS에서는 개발자의 직접적인 메모리 제어 허용 X (메모리 주소를 이용하여 값 접근 불가)

 - 기억하고 싶은 값을 메모리에 저장하고 저장된 값을 읽어 들여 재사용하기 위해 변수를 이용

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

 - 값의 위치를 가리키는 상징적인 이름 (변수를 통해 값에 안전하게 접근 가능)

 - 할당/대입/저장 (변수에 값 저장)

 - 참조 (변수에 저장된 값 읽기)

 - 변수 네이밍 매우 중요! (가독성 높이기)

4.2 식별자

 - 어떤 값을 구별해서 식별할 수 있는 고유한 이름

 - 값이 저장되어 있는 메모리 주소와 매핑 관계, 매핑 정보도 메모리에 저장됨

 - 식별자는 값이 아니라 메모리 주소를 기억함

 - 변수, 함수, 클래스 등 이름도 모두 식별자임

 - JS에서 함수도 값임

4.3 변수 선언

 - 변수 생성

 - 값 저장 위한 메모리 공간 확보하고

   변수 이름과 확보된 메모리 공간 주소를 연결 (네임 바인딩)하여 값 저장하기 위한 준비

 - var, let, const 키워드 사용

   - var 키워드: 함수 레벨 스코프 지원, 전역 변수 부작용

 - ES6: 하위 호환성 유지 + ES5 추가 기능, ES5의 superset (상위 집합)

 

var score;

 - 변수 선언 이후 JS 엔진에 의해 undefined 값이 암묵적 할당되어 초기화됨

   - 쓰레기 값 참조 방지 위함

 - 실행 컨텍스트를 통해 식별자와 스코프를 관리함

 - 선언하지 않은 식별자에 접근시 ReferenceError 발생

4.4 변수 선언의 실행 시점과 변수 호이스팅

 - 변수 선언이 코드가 순차적으로 실행되는 런타임 이전에 먼저 실행됨

 - JS 엔진의 평가: 모든 선언문 찾아서 먼저 실행 (선언 + 암묵적 초기화)

 - JS 엔진의 런타임: 모든 선언문을 제외한 소스코드 한 줄씩 순차적으로 실행

 - 변수 선언문이 코드의 선두로 끌어 올려진 것 처럼 동작 => 변수 호이스팅

 - var, let, const, function, function*, class 등 키워드 사용해서 선언한 모든 식별자는 호이스팅됨

 - 모든 선언문은 런타임 이전 단계에서 먼저 실행됨

4.5 값의 할당

 - 변수 선언과 할당을 하나의 문으로 단축 표현 가능

 - JS 엔진은 단축 표현한 하나의 문을 2개의 문으로 나누어 각각 실행함

 - 변수 선언은 JS 엔진의 평가 과정에서 먼저 실행되고, 값의 할당은 JS 엔진의 런타임 과정에서 실행됨

 - 변수에 값 할당 시, 이전에 암묵적으로 초기화된 값인 undefined가 저장된 메모리 공간을 지우는 것이 아님

 - 새로운 메모리 공간을 확보하고 그곳에 값을 재할당하는 것임

4.6 값의 재할당

 - 변수에 저장된 값을 다른 값으로 변경 => 변수

 - 값을 재할당할 수 없어서 변수에 저장된 값을 변경하지 못함 => 상수

 - 상수는 단 한번만 할당 가능

 - 어떤 식별자와도 연결되지 않은 값이 들어있는 메모리 공간 => G.C에 의해 자동 해제됨

 - JS는 G.C를 내장하고 있는 매니지드 언어, G.C를 통해 메모리 누수 방지

4.7 식별자 네이밍 규칙

 - 특수문자를 제외한 문자, 숫자, 언더스코어, 달러 기호 사용 가능

 - 숫자로 시작 허용 X, 특수문자를 제외한 문자, 언더스코어, 달러 기호로는 시작 가능

 - 예약어는 식별자로 사용 불가

 - ES5 부터 유니코드 문자 허용 (사용 권장 X)

 - 대소문자 구별

 - 좋은 변수 이름 => 코드의 가독성을 높임

 - 주석 사용 권장 X

 - 네이밍 컨벤션

   - camelCase

   - snake_case

   - PascalCase

   - typeHungarianCase

 - JS: 변수/함수 => 카멜 케이스

       생성자 함수/클래스 => 파스칼 케이스 사용 권장