JavaScript | Array.prototype이 뭔가요?
JavaScript에 대해서 MDN 자료로 공부를 하던 중, Array.prototype.reduce()와 같은 형태가 궁금해졌습니다. 그래서 찾아보니 다음과 같이 정리할 수 있었습니다.
Array
JavaScript에서 Array는 배열을 나타내는 내장 객체입니다. 배열은 여러 항목을 저장할 수 있는 목록과 같은 데이터 구조입니다. 예를 들면 var fruits = ['apple', 'banana', 'cherry'];과 같이 배열을 생성할 수 있습니다.
prototype
JavaScript는 프로토타입 기반의 언어입니다. 모든 객체는 프로토타입이라는 다른 객체에 연결됩니다. prototype은 객체지향 상속과 메소드 및 속성을 공유하는 데 사용되는 메커니즘입니다.
예를 들어, JavaScript에서 모든 배열 (Array 객체의 인스턴스)는 Array.prototype을 그들의 프로토타입으로 가집니다. 이것은 모든 배열이 Array.prototype에 정의된 메소드와 속성에 접근할 수 있다는 것을 의미합니다.
reduce()
reduce()는 배열의 각 요소에 대해 주어진 reducer 함수를 실행하고, 단일 출력 값 (즉, 축소된 값)을 반환하는 Array.prototype의 메소드입니다.
사실 위의 내용만으로는 잘 이해가 가지 않아서 조금 더 찾아보았습니다.
자바스크립트의 모든 객체는 다른 객체에 연결된 "프로토타입"을 가집니다. 이 연결된 객체를 통해 메소드와 속성을 "상속"받습니다. 이 프로토타입 체인의 끝에는 대개 null이 위치합니다.
배열의 프로토타입에 대한 이야기를 할 때, 우리는 사실 Array.prototype 객체를 가리키는 말을 합니다. 이 Array.prototype 객체는 배열과 관련된 모든 메소드와 속성을 포함하고 있습니다. 예를 들어, .map(), .filter(), .reduce() 등의 메소드는 모두 이 Array.prototype에 정의되어 있습니다.
그래서, 만약 당신이 배열에 대한 메소드를 사용하려고 할 때 (예: myArray.map(...)) 자바스크립트는 다음과 같은 과정을 거칩니다
- myArray에 직접 map 메소드가 있는지 확인합니다.
- 없다면, myArray의 프로토타입 (Array.prototype)을 확인하여 map 메소드가 있는지 확인합니다.
- Array.prototype에 map 메소드가 있다면 그것을 실행합니다.
이런 방식으로, 모든 배열은 Array.prototype에 정의된 메소드와 속성을 사용할 수 있게 됩니다.
꼬리에 꼬리를 무는 궁금증이 생겼습니다. 만약 myArray에 직접 map 메소드가 있는 경우는 어떤 경우인지 말이죠. 다음과 같은 예제로 설명할 수 있다고 합니다.
let myArray = [1, 2, 3];
// myArray에 직접 map 메소드 추가
myArray.map = function() {
return 'This is a custom map function!';
};
console.log(myArray.map()); // 'This is a custom map function!'
궁금증이 풀렸습니다.