모던 자바스크립트 Deep Dive (Ch.12 ~ Ch.15)

12장 함수

12.1 함수란?

함수는 일련의 과정을 문으로 구현하고 코드 블록으로 감싸서 하나의 실행 단위로 정의한 것.

12.2 함수를 사용하는 이유

코드의 재사용 측면에서 유용, 유지보수 편의성 높임, 코드 신뢰성 높임, 코드 가독성 향상.

12.3 함수 리터럴

• 함수 이름은 함수 몸체 내에서만 참조할 수 있는 식별자임.
• 함수 이름 생략 가능
• 함수는 객체지만 일반 객체와는 다름.
• 일반 객체와 달리 함수는 호출 가능, 일반 객체에는 없는 함수 객체만의 고유한 프로퍼티 가짐.

12.4 함수 정의

함수 정의 방식에는 4가지 있음.
함수 선언문, 함수 표현식, Function 생성자 함수, 화살표 함수

12.4.1 함수 선언문 & 12.4.2 함수 표현식

• 함수 선언문은 함수 이름 생략 불가, 함수 리터럴은 이름 생략 가능(익명 함수)
• 함수 선언문은 표현식이 아닌 문임. 함수 표현식은 표현식인 문.
• 코드 문맥에 따라 함수 리터럴을 함수 선언문으로 해석하기도, 함수 리터럴 표현식으로 해석하기도 함.

12.4.3 함수 생성 시점과 함수 호이스팅

• 함수 표현식으로 정의하면 함수 호이스팅이 아닌 변수 호이스팅이 발생함.
• 함수 표현식 이전에 함수 참조하면 undefined, 이 때 함수 호출하면 undefined 호출하는 것과 마찬가지이므로
  타입 에러 발생.
• 함수 호이스팅은 함수 호출 전 반드시 함수 선언해야 한다는 당연한 규칙 무시하므로,
  함수 선언문 대신 함수 표현식 사용을 권장.

12.4.4 Function 생성자 함수

• 일반적이지도 않고 바람직하지도 않음.
• 클로저를 생성하지 않음.

12.4.5 화살표 함수

• 화살표 함수는 항상 익명 함수로 정의
• 기존 함수 선언문 또는 표현식 완전히 대체하기 위해 디자인된 건 아님.
• 생성자 함수로 사용할 수 없고, 기존 함수와 this 바인딩 방식 다름.
• prototype 프로퍼티 없음, arguments 객체 생성 안함.

12.5 함수 호출

• 함수는 매개변수의 개수와 인수 개수 일치하는지 체크하지 않음.
• 인수가 전달되지 않은 경우, 단축 평가를 사용해 매개변수에 기본값 할당할 수 있음.
• 이상적인 함수는 한 가지 일만 하고, 가급적 작아야 함.
• 함수 호출은 표현식임. 반환값으로 평가됨.
• 반환문은 함수 몸체 내부에서만 사용 가능함.

12.6 참조에 의한 전달과 외부 상태의 변경

원본 객체 변경되는 부수 효과 막기 위해, 객체를 불변 객체로 만들고,
상태 변경이 필요한 경우, 깊은 복사를 통해 새로운 객체 생성, 재할당을 통해 교체함.

12.7 다양한 함수의 형태

즉시 실행 함수, 재귀 함수, 중첩 함수, 콜백 함수, 순수/비순수 함수 등이 있음.

13장 스코프

13.1 스코프란?

스코프는 식별자가 유효한 범위를 말한다.

13.2 스코프의 종류

지역 스코프, 전역 스코프

13.3 스코프 체인

• 스코프가 계층적으로 연결된 것.
• 변수 참조 시 변수 참조하는 코드의 스코프에서 시작, 상위 스코프 방향으로 이동하며 선언된 변수를 검색함.
• 상위 스코프에서 유효한 변수 하위 스코프에서 자유롭게 참조 가능, 반대는 불가.(상속과 유사)

13.4 함수 레벨 스코프

var 키워드는 함수의 코드 블록만을 지역 스코프로 인정함.

13.5 렉시컬 스코프

함수를 어디서 정의했는지에 따라 함수 상위 스코프 결정함.

14장 전역 변수의 문제점

14.1 변수의 생명 주기

• 지역 변수 생명 주기는 함수 생명 주기와 일치
• 스코프 단위로 호이스팅 동작
• 전역 변수 생명 주기는 전역 객체의 생명 주기와 일치

14.2 전역 변수 문제점

• 암묵적 결합
• 긴 생명 주기
• 스코프 체인 상에서 종점에 존재(검색 속도 느림)
• 네임스페이스 오염(파일 분리되어 있어도 전역 스코프 공유함)

14.3 전역 변수의 사용 억제하는 방법

즉시 실행 함수, 네임스페이스 객체, 모듈 패턴, ES6 모듈 등

15장 let, const 키워드와 블록 레벨 스코프

15.1 var 키워드로 선언한 변수의 문제점

변수 중복 선언 허용, 함수 레벨 스코프, 변수 호이스팅

15.2 let 키워드

• 변수 중복 선언 금지함.
• 블록 레벨 스코프
• 변수 호이스팅이 발생하지 않는 것처럼 동작함.
• let으로 선언한 전역 변수는 전역 객체의 프로퍼티가 아님. (window.~~~ 와 같이 접근할 수 없음.)
• let 전역 변수는 보이지 않는 개념적인 블록 내에 존재하게 됨.

15.3 const 키워드

• const 키워드로 선언한 변수는 선언과 동시에 초기화해야 함.
• 재할당 금지
• 상수를 나타냄(유지보수성 향상)
• const 키워드로 선언된 변수에 객체 할당한 경우 값 변경 가능함.
• 재할당 금지할 뿐 "불변" 의미하지는 않음.

15.4 var vs. let vs. const

• ES6를 사용한다면 var 키워드는 사용하지 않는 게 좋음.
• 재할당이 필요한 경우에 한정해 let 키워드를 사용하고, 변수의 스코프는 최대한 좁게.
• 변경이 발생하지 않고 읽기 전용으로 사용하는 원시 값과 객체에는 const 키워드를 사용.
• 변수를 선언할 때 일단은 const 키워드를 사용한 다음, 반드시 재할당이 필요하면 let 키워드로 변경.