[모던 JS Deep Dive] 26장 - ES6 함수의 추가 기능

26.1 함수의 구분

  - ES6 이전 함수는 동일한 함수로 다양한 형태로 호출 가능 (일반 함수, 생성자 함수, 메서드)

    - 사용 목적에 따라 명확히 구분 안됨

    - ES6 이전 모든 함수는 callable 이면서 constructor (객체에 바인딩된 함수, 콜백 함수도 포함)

      - constructor => 객체에 바인딩된 함수가 prototype 프로퍼티 가지고, 프로토타입 객체도 생성하는 문제 발생

      - ES6 이전 메서드는 프로퍼티 값으로 익명 함수 표현식 할당하는 형태임

  - ES6에서 함수를 사용 목적에 따라 세가지 종류로 명확히 구분함

    - 일반 함수(함수 선언문, 함수 표현식); constructor O, prototype O, super X, arguments O

    - 메서드; constructor X, prototype X, super O, arguments O

    - 화살표 함수; constructor X, prototype X, super X, arguments X

26.2 메서드

  - ES6 사양, 메서드는 메서드 축약 표현으로 정의된 함수만을 의미함

    - 인스턴스 생성 불가능한 non-constructor (생성자 함수로서 호출 불가)

    - prototype 프로퍼티 없고 프로토타입도 생성 X

    - 자신을 바인딩한 객체를 가리키는 내부 슬롯 [[HomeObject]] 가짐

      - super 키워드 이용하여 super 클래스의 메서드 참조 가능

  - 표준 빌트인 객체가 제공하는 프로토타입 메서드, 정적 메서드 모두 non-constructor

26.3 화살표 함수

  - 콜백 함수 내부 this가 전역 객체 가리키는 문제 해결 대안으로 유용

  - 화살표 함수 정의

    - 함수 정의; 함수 표현식으로 정의

    - 매개변수 선언; 매개변수 1개이면 소괄호 생략 가능, 여러 개면 생략 불가

    - 함수 몸체 정의

      - 하나의 문이면 중괄호 생략 가능, 표현식인 문이면 암묵적으로 반환 (아니면 에러 발생)

      - 객체 리터럴 반환 시에는 소괄호로 감싸 주어야 함

      - 즉시 실행 함수로도 사용 가능

      - 콜백 함수로서 정의할 때 유용, this도 편리하게 설계됨

  - 화살표 함수와 일반 함수의 차이

    - 화살표 함수는 인스턴스 생성 불가능한 non-constructor (생성자 함수로서 호출 불가)

    - 중복된 매개변수 이름 선언 불가

    - 화살표 함수는 함수 자체의 this, arguments, super, new.target 바인딩 갖지 않음

      - 스코프 체인을 통해 상위 스코프의 this, arguments, super, new.target 참조함

  - this

    - 함수 호출 방식에 따라 this에 바인딩할 객체가 동적으로 결정됨

    - 클래스 내부 모든 코드에는 strict mode가 암묵적으로 적용됨

    - 화살표 함수는 함수 자체의 this 바인딩 갖지 않음

    - 화살표 함수 내부에서 this 참조 시 상위 스코프의 this 그대로 참조 (lexical this)

    - 프로퍼티에 할당한 화살표 함수도 스코프 체인 상에서 가장 가까운 상위 함수 중에서

      화살표 함수가 아닌 함수의 this 참조

    - 객체 리터럴 내에서는 ES6 메서드 축약 표현 사용 권장

    - 프로토타입 객체의 프로퍼티에는 일반 함수 할당

    - 클래스에서 클래스 필드에 할당한 화살표 함수 내부의 this는 클래스가 생성한 인스턴스 가리킴,

      하지만 인스턴스 메서드가 됨

    - 클래스에서 메서드 정의시에는 ES6 메서드 축약 표현 사용 권장

  - super

    - 화살표 함수 내부에서 super 참조 시 상위 스코프의 super 참조

    - 화살표 함수의 super는 상위 스코프인 constructor의 super 가리킴

  - arguments

    - 화살표 함수는 함수 자체의 arguments 바인딩 갖지 않음

    - 상위 스코프의 arguments 참조

    - 전역 객체에는 arguments 존재 X (함수 내부에서만 유효)

    - 화살표 함수로 가변 인자 함수 구현 시에는 반드시 Rest 파라미터 사용!

26.4 Rest 파라미터

  - 기본 문법

    - function fn (...args) { }

    - 함수에 전달된 인수들의 목록을 배열로 전달 받음

    - 파라미터 마지막 순서로 와야 함

    - 단 하나만 선언 가능

    - 함수 객체의 length 프로퍼티에는 영향 주지 않음

  - Rest 파라미터와 arguments 객체

    - arguments 객체

      - 함수 호출 시 전달된 인수들의 정보를 담고 있는 순회 가능한 유사 배열 객체

      - 함수 내부에서 지역 변수처럼 사용 가능

      - 배열 메서드 사용 위해서는 call이나 apply 메서드 사용해야 함

    - Rest 파라미터

      - 배열 메서드 사용 가능

26.5 매개변수 기본값

  - JS 엔진은 매개변수의 개수와 인수의 개수 체크하지 않음 (에러 발생 X)

  - ES6 매개변수 기본값 세팅 가능

  - 매개변수 기본값은 매개변수에 인수 전달하지 않은 경우와 undefined 전달한 경우에만 유효

  - Rest 파라미터에는 기본값 지정 불가

  - 매개변수 기본값은 함수 객체의 length 프로퍼티와 arguments 객체에 영향 주지 않음