TIL - 20220730

 오늘은 모던 JavaScript 튜토리얼에서 내장 클래스 확장하기(https://ko.javascript.info/extend-natives)에 대해 공부했다. 작성한 질문은 다음과 같다.

 코드와 함께 살펴보자.

class PowerArray extends Array {
    isEmpty() {
        return this.length === 0;
    }
}

let arr = new PowerArray(1, 2, 5, 10, 50);
alert(arr.isEmpty()); // false

let filteredArr = arr.filter(item => item >= 10);
alert(filteredArr); // 10, 50
alert(filteredArr.isEmpty()); // false

배열, 맵 같은 내장 클래스를 기존보다 확장하고자 내장 클래스를 상속받고 기능을 추가한 새 클래스를 만들어 인스턴스(객체)를 만들고 filter와 map을 사용하면 상속받은 클래스의 인스턴스를 반환한다. 또한 이 인스턴스를 구현할 때, 내부에서 인스턴스의 constructor 프로퍼티를 사용한다. 다음과 같은 코드로 관계를 확인할 수 있다.

arr.constructor === PowerArray; // true

 

 내장 객체는 정적 메서드를 상속받을 수 있지만, 내장 클래스는 정적 메서드를 상속받을 수 없다. Array와 Date는 Object를 상속받기 때문에 Object.prototype에 구현된 메서드를 사용할 수 있다. 하지만, Array.[[Prototype]], Date.[[Prototype]]은 Object를 참조하지 않기에 Array.keys()나 Date.keys()와 같은 정적 메서드를 인스턴스에서 사용할 수 없다.