함수 객체

1. 자바스크립트에서는 함수도 객체다

함수의 기본 기능인 코드 실행뿐만 아니라, 함수 자체가 일반 객체처럼 자신의 프로퍼티들을 가질 수 있다.

2. 자바스크립트에서 함수는 값으로 취급된다

함수도 일반 객체처럼 취급될 수 있다. 때문에 다음과 같은 동작이 가능하다.

- 리터럴에 의해 생성

- 변수나 배열의 요소, 객체의 프로퍼티 등에 할당 가능

- 함수의 인자로 전달 가능

- 함수의 리턴값으로 리턴 가능

- 동적으로 프로퍼티를 생성 및 할당 가능

이런 기능이 모두 가능한 객체를 일급 객체라고 한다.

자바스크립트 함수가 가지는 이런 일급 객체의 특성으로 함수형 프로그래밍이 가능하다.

변수나 프로퍼티의 값으로 할당

// 변수에 함수 할당

var foo = 100;

var bar = function() { return 100; };

console.log(bar());    // 100

// 프로퍼티에 함수 할당

var obj = {};

obj.baz = function () { return 200; };

console.log(obj.baz());    // 200

함수 인자로 전달

// 함수 표현식으로 foo() 함수 생성

var foo = function(func) {

func();    // 인자로 받은 func() 함수 호출

}

// foo() 함수 실행

foo(function() {

console.log("함수는 인자로 사용될 수 있다.");

});

리턴값으로 활용

var foo = function() {

return function() {

console.log('this function is the return value');   

};

};

var bar = foo();

bar();

함수 객체의 기본 프로퍼티

함수는 일반적인 객체의 기능에 추가로 호출됐을 때 정의된 코드를 실행하는 기능을 가지고 있다.

또한, 일반 객체와는 다르게 추가로 함수 객체만의 표준 프로퍼티가 정의되어 있다.

// 함수 객체의 기본 프로퍼티 출력

function add(x,y) {

return x + y;

}

console.dir(add);

다양한 프로퍼티가 기본 프로퍼티로 생성된 것을 확인할 수 있다.

- name 프로퍼티 : 함수의 이름

- caller 프로퍼티 : 자신을 호출한 함수

- arguments 프로퍼티 : 함수를 호출할 때 전달된 인자값.

- __proto__ 프로퍼티 : 모든 자바스크립트 객체는 자신의 프로토타입을 가리키는 [[Prototype]] 라는 내부 프로퍼티를 가진다. 

   [[ Prototype ]]과 __proto__는 같은 개념이다.

   

add() 함수는 [[Prototype]] 프로퍼티를 가지고 있고 이를 통해 자신의 부모 역할을 하는 프로토타입 객체를 가리킨다.

모든 함수 객체의 부모 역할을 하는 프로토타입 객체는 Function.prototype 객체이며, 이것 역시 함수 객체이다.

Function.prototype 함수 객체의 부모는 자바스크립트의 모든 객체의 조상격인 Object.prototype 객체이다.

Function.prototype 객체

모든 함수들의 부모 역할을 하는 프로토타입 객체다.

모든 함수는 Function Prototype 객체가 있는 프로퍼티나 메서드를 상속받아 그대로 사용할 수 있다.

Function.prototype 객체가 가지는 프로퍼티와 메서드

length 프로퍼티

함수가 정상적으로 실행될 때 기대되는 인자의 개수

prototype 프로퍼티

모든 함수는 객체로서 prototype 프로퍼티를 가지고 있다.

주의할 것은 함수 객체의 prototype 프로퍼티는 모든 객체의 부모를 나타내는 내부 프로퍼티인 [[Prototype]]과 혼동하지 말아야 한다.

prototype 프로퍼티와 [[Prototype]] 프로퍼티

두 프로퍼티 모두 프로토타입 객체를 가리킨다는 점에서는 공통점이 있지만, 관점에 차이가 있다.

[[Prototype]]은 객체 입장에서 자신의 부모 역할을 하는 프로토타입 객체를 가리키는 반면,

함수 객체가 가지는 prototype 프로퍼티는 이 함수가 생성자로 사용될 때 이 함수를 통해 생성된 객체의 부모 역할을 하는 프로토타입 객체를 가리킨다.

prototype 프로퍼티는 함수가 생성될 때 만들어지며, 단지 constructor 프로퍼티 하나만 있는 객체를 가리킨다.

그리고 prototype 프로퍼티가 가리키는 프로토타입 객체의 유일한 constructor 프로퍼티는 자신과 연결된 함수를 가리킨다.

즉, 자바스크립트에서는 함수를 생성할 때, 함수 자신과 연결된 프로토타입 객체를 동시에 생성하며, 이 둘은 각각 prototype과 constructor라는 프로퍼티로 서로를 참조하게 된다.

function myFunction() {                                 // 1

return true;

}

console.dir(myFunction.prototype);                   // 2

console.dir(myFunction.prototype.constructor);    //3

1. myFunction() 함수가 생성됨과 동시에 myFunction() 함수의 prototype 프로퍼티에는 이 함수와 연결된 프로토타입 객체가 생성된다.

2. myFunction.prototype은 myFunction() 함수의 프로토타입 객체를 의미한다.

실행 결과를 보면 myFunction.prototype 객체는 constructor와 __proto__라는 두 개의 프로퍼티가 있다.

이 객체는 myFunction() 함수의 프로토타입 객체이므로 constructor 프로퍼티가 있음을 확인할 수 있다.

또한, 프로토타입 객체 역시 자바스크립트 객체이므로 자신의 부모 역할을 하는 __proto__ 프로퍼티가 있다.

3. 프로토타입 객체가 myFunction() 함수를 가리키고 있다.