Prototype(2)
지난 시간에 생성자 함수 Array를 가지고 prototype과 proto의 관계를 살펴보았다.
이번 시간에는 생성자 함수 Function, Object을 살펴보자.
1. Function
: 함수를 생성하는 생성자 함수이다.
// const a = new Function('arg1', 'return arg1')
const a = function(arg1) {
return arg1
}
위의 두 함수는 동일한 함수이다.함수 a의 proto는 무엇일까?
a의 부모인 Function의 prototype이다.
a.__proto__ === Function.prototype // true
Function의 prototype이 뭔지 보자.
console.log(Function.prototype)
결과
ƒ () { [native code] }
브라우저 콘솔에 찍어봤는데 자세한 결과가 안나온다...어쨋든 apply, call, bind 등의 메소드가 있다.
그렇기 때문에 우리가 선언한 함수에서 이런 메소드에 접근할 수 있었던 것이다.
2. Object
: 객체를 생성하는 생성자 함수이다.
const b = new Object()객체 b의 proto는 무엇일까?
마찬가지로 생성자 함수 Object의 prototype이다.
b.__proto__ === Object.prototype // true
Object의 prototype이 뭔지 보자.
console.log(Object.prototype)
결과
{constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}
constructor: ƒ Object()
hasOwnProperty: ƒ hasOwnProperty()
isPrototypeOf: ƒ isPrototypeOf()
propertyIsEnumerable: ƒ propertyIsEnumerable()
toLocaleString: ƒ toLocaleString()
toString: ƒ toString()
valueOf: ƒ valueOf()
__defineGetter__: ƒ __defineGetter__()
__defineSetter__: ƒ __defineSetter__()
__lookupGetter__: ƒ __lookupGetter__()
__lookupSetter__: ƒ __lookupSetter__()
get __proto__: ƒ __proto__()
set __proto__: ƒ __proto__()함수랑 똑같으므로 설명은 생략한다.
여기까지 Array, Function, Object에서 proto & prototype의 관계를 살펴보았다.
Object(생성자 함수) → obj(자식 객체)의 경우는
생성자 함수에서 바로 자식 객체를 만드므로 이상한 점이 없지만,
Function(생성자 함수) → Array(생성자 함수이면서 Function의 자식 객체) → arr(자식 객체)
이런 경우는 프로토타입 관계가 어떻게 되는지 파악하기 어렵다.
이 부분은 다음 시간에 자세하게 알아보도록 하자.
