[JS] Object.prototype.function의 호출객체를 얻는 방법

안녕하세요, Einere입니다.

(ADblock을 꺼주시면 감사하겠습니다.)

---

오늘은 특정 객체의 메소드가 자신을 호출한 객체에 어떻게 접근하는지 알아보도록 하겠습니다.

 

 

 

발단

ES6의 문법들을 보면 forEach, map, reduce, filter과 같은 배열객체의 메소드들이 많다. (Array.protytype의 속성으로 설정되어 있으므로...)

이런 함수들은 어떻게 자신을 호출한 배열객체에 접근할까?

 

 

 

정답

Array.prototype.myUcase = function() {
    for (i = 0; i < this.length; i++) {
        this[i] = this[i].toUpperCase();
    }
};

const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.myUcase(); 
// ["BANANA", "ORANGE", "APPLE", "MANGO"] 출력

W3School의 예제 중 하나이다.

커스텀 함수인 myUcase에 익명 함수를 할당하는데, 함수 내부에선 호출 객체를 this를 이용해 접근한다.

이 사실을 몰랐을 때에는 arguments.callee.caller.name 뭐 이딴거나 시도해보고 있었다..

 

 

 

참고

https://www.w3schools.com/jsref/jsref_prototype_array.asp