흔히 아는 자바스크립트의 객체를 말하는 것이 맞다.
배열, 함수 모두 사실은 객체이며 그 중에서 함수는 일급 객체라고 불릴 만큼 자바스크립트에서 중요한 요소로 자리잡힌다.
컴퓨터 프로그래밍 언어 디자인에서, 일급 객체(영어: first-class object)란 다른 객체들에 일반적으로 적용 가능한 연산을 모두 지원하는 객체를 가리킨다. 보통 함수에 매개변수로 넘기기, 수정하기, 변수에 대입하기와 같은 연산을 지원할 때 일급 객체라고 한다.
출처: 위키백과
아래는 new Array()라는 코드로 만든 빈 배열이다.
보이는 바와 같이 내부적으로는 length
프로퍼티, __proto__
프로퍼티를 가진 객체이다. key와 value의 모양을 가진 구조이지 않은가. 객체가 맞다.
함수도 찍어보자.
마찬가지로 함수 또한 내부적으로는 객체이며, 당장 주요하게 볼 만한 프로퍼티로는 arguments
와 prototype
, 그리고 __proto__
가 있다.
arguments
프로퍼티는 함수에 대해 포스팅 할 때 설명하도록 하고,
prototype
과 __proto__
프로퍼티는 프로토타입이라는 개념이 필요하므로 아래에서 다시 다루겠다.
아무튼 함수 또한 객체이다.
const obj1 = {a: 1}
console.log( obj1.hasOwnProperty('a') ) // true
위의 코드에서 a라는 프로퍼티 하나만 가지는 객체를 만들었다. 이 객체 안에 hasOwnProperty
라는 메서드가 있지도 않는데 어떻게 콘솔엔 true
가 찍힐까?
이는 어떤 객체에서 무언가 찾을 때, 그 객체에 찾는 것이 없으면 그 객체의 부모에게서 찾기 때문이다. 세상에 부모 없이 태어나는 생물이 있으랴. 별 것 아닌 듯 보이는 저 객체 또한 마찬가지이다. 우리는 모두 어디에서 와서 어디로 가는 지 곰곰히
그렇다면 방금 내가 만든 obj1이라는 객체의 부모는 누구일까.
그 부모를 가리키는 프로퍼티가 __proto__
프로퍼티이다.
실은 [[Prototype]]
이라는 프로퍼티인데, 크롬 브라우저에서는 __proto__
라는 프로퍼티로 표현된다.
자바스크립트에서는 number, string, boolean, undefined, null을 제외한 모든 것이 객체이며, 모든 객체는 부모가 있다.
예를 들어, 배열의 부모는 Array.prototype
이라는 객체이며, 이 객체의 부모는 Object.prototype
이다.
우리가 배열을 만들고, 요소를 추가하기 위해 push()
메서드를 쓰려고 하는데 이 메서드가 우리가 만든 배열 안에 있을까?
이 포스팅의 맨 처음에서 보았듯 갓 만든 배열에는 length
와 __proto__
프로퍼티 뿐이다. 그럼에도 우리가 빈 배열에서 push() 메서드를 쓸 수 있는 건, 배열의 __proto__
가 가리키는 Array.prototype
이라는 객체에 push() 메서드가 있기 때문이다.
위에서 함수를 콘솔에 찍었을 때 보았던 __proto__
프로퍼티 또한, 함수의 부모이다.
함수의 부모는 Function.prototype
객체이고, 이 객체의 부모는 Object.prototype
객체이다.
Object.prototype 객체는 모든 객체의 1세대 조상이다.
그렇다면 함수를 찍었을 때 __proto__
프로퍼티 말고 prototype
프로퍼티가 있었는데 이건 또 무엇일까?
그것은 다음 장에서 생성자에 대해 다루면서 설명해야겠다.