[모딥다] 함수와 일급객체 예제 18-7 파헤치기

오랜만에 다시 모딥다를 읽고 있다.
이전에 함수와 일급객체 파트를 다 읽고 프로토타입을 읽을 차례인데
너무 안 읽혀서 다시 함수와 일급객체 파트를 읽어나가는중.

그러다 예제 하나를 보곤 또 왜?!?!! 병이 도져서 깊게 파버림.

function sum() {
	const array = Array.prototype.slice.call(arguments);
    array.reduce(function(pre, cur) {
    	return pre + cur
    }, 1);
}

console.log(sum(1, 2)); // 3
console.log(sum(1, 2, 3, 4, 5)); // 15

이런 예제였는데 저 slice 메서드 뒤에 붙은 .call에 대해 알고 싶은것!!!
원래 slice 메서드의 매개변수에는 start idx 나 start idx, end idx 이렇게 들어가지 않는가?
그런데 arguments가 들어간다니 이게 무슨일인가 싶었다.
그렇게 되면 내부에선 어떻게 작동하는건데?!

전용 과외선생님 채찌피티에게 물어보고 정리한 생각.

1. 우선 arguments 객체는 배열이 아닌 유사 배열 객체이므로 slice 메서드를 직접 사용할 수 없다.
2. 따라서 Array.prototype에서 빌려와서 사용해야 하는데 이것을 가능하게 해주는 것이 바로 call 메서드.
3. call의 매개변수는 thisArg, arg1, arg2...이다. 즉 thisArg를 slice의 this에 바인딩하고 뒤의 arg1, arg1...을 slice의 인수로 넘기는것!!!!
4. Array.prototype.slice.call(arguments)는 Array.prototype.slice.call(arguments, 0)과 동일하게 동작.
5. 따라서 array는 차례로 [1, 2], [1, 2, 3, 4, 5]가 되는것.

그리고 비교해 준 예제

function example() {
  console.log(arguments); // 유사배열 객체
  const realArray = Array.prototype.slice.call(arguments, 1);
  console.log(realArray); // [두 번째 인자부터 복사됨]
}

example("a", "b", "c"); // ["b", "c"]

궁금한건 절.대. 못 참아.
이렇게 또 하나 얻어간다 휴~~~

+) ES6의 Rest파라미터로 arguments 객체의 중요성은 줄어들었지만
레거시 코드에선 사용될 수 있으므로 이런게 있다~~라고 참고해두기