[모딥다] 26장 ES6 함수의 추가 기능

🥞 26.1 함수의 구분

 

ES6 이전의 함수

- 함수는 별다른 구분 없이 다양한 목적으로 사용됨.

- 편리해보이지만 실수 유발 & 성능 면에서 손해

- 일반 함수로서 호출할 수 있는 것은 물론 생성자 함수로서 호출할 수 있었음. 

- 객체에 바인딩 된 함수도 일반 함수 & 생성자 함수로서 모두 호출 가능했음.

 

ES6 이후의 함수

 

 

 

 

 

🥞 26.2 메서드

 

정확한 정의가 생김.

 

🍯 메서드

- 메서드 축약 표현으로 정의된 함수만을 의미. 

- 인스턴스를 생성할 수 없는 non-constructor -> 생성자 함수로서 호출할 수 없다.

- prototype 프로퍼티가 없고 프로퍼티도 생성하지 않는다.

- 자신을 바인딩한 객체를 가리키는 내부 슬롯 [[HomeObject]] 를 갖는다 -> super 키워드를 사용할 수 있다. (참조 가능)

 

 

 

 

 

🥞 26.3 화살표 함수

 

26.3.1 화살표 함수 정의

const 식별자 = () => {}

한줄의 표현식로 쓸 수 있으면 return, {} 생략 가능. 

객체는 () 로 감싸줘야함. 

 

 

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

 

01. 화살표 함수는 인스턴스를 생성할 수 없는 non-constructor 다.

02. 중복된 매개변수 이름을 선언할 수 없다. 

(일반 함수는 'strict mode' 에서만 중복 불가)

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

화살표 함수 내부에서 참조시 -> 스코프 체인을 통해 상위 스코프에서 찾음

 

 

26.3.3 this

 

가장 큰 차이.

 

클래스 내부 -> strict mode 적용 -> 이반 함수로서 호출된 모든 함수의 내부 this 에는 undefined 가 바인딩됨. 

 

2번 콜백 함수의 this 와 외부 함수 this 가 서로 다른 값을 가진다. 

1번에선 prefix.

 

"콜백 함수 내부의 this 문제"

=> 화살표 함수로 해결 가능. 

화살표 함수는 함수 자체의 this 바인딩을 갖지 않기 때문. 상위 스코프의 this 를 그대로 참조함. 

=> "lexical this" 라고 함. 

 

메서드를 화살표 함수로 정의하는 것은 피해야함. 

메서드에서 this.프로퍼티이름 사용하면 -> 사용할 수 없음. this 바인딩이 없기 때문. 

 

 

26.3.4 super

 

super 바인딩 갖지 않음. => 상위 스코프의 super 을 참조함. 

 

26.3.5 arguments

 

arguments 바인딩 갖지 않음. => 상위 스코프의 arguments  참조함. 

 

 

 

 

 

🥞 26.4 Rest 파라미터

 

26.4.1 기본 문법

 

... rest

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

 

일반 매개변수와 함께 사용 가능, 사용시 맨 뒤에 둬야함. 

rest 파라미터는 단 하나만 선언할 수 있음. 

length 프로퍼티에 영향을 주지 않음. (세지 않음)

 

26.4.2 Rest 파라미터와 arguments 객체

 

arguments 객체

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

- 함수 내부에서 지역 변수처럼 사용할 수 있다.

- 하지만 유사 배열 객체이므로 -> 배열 메서드를 사용하려면 Function.call, Function.apply 메서드를 사용해 배열로 변환해야함. (번거로움)

-> rest 로 받으면 이런 번거로움을 피할 수 있음. 

 

 

 

 

 

🥞 26.5 매개변수 기본값

 

함수 호출 시 매개변수와 인수의 수가 일치하는지 체크하지 않음. 

=> 만약 없을 시 undefined 로 에러 발생

=> 방어 코드 필요

 

기본값을 전달할 수 있음. 

 

 

 

 

기본 값을 같이 전달하면 

함수 내에서 사용하던 인수 체크 및 초기화를 간소화 할 수 있다.

 

기본값은

- 매개변수에 인수를 전달하지 않은 경우

- undefined 를 전달한 경우

에만 유효하다.

 

rest 파라미터에는 기본값 지정할 수 없음.