본문으로 바로가기

Function

실제 코딩에서 Function을 사용하는 일이 많지는 않지만 그 의미와 그것이 어떤 위치를 차지하는지는 이해하고 있어야 합니다.

그래야 자바스크립트의 객체지향 프로그래밍 세계에서 함수를 제대로 이해할 수 있습니다.





Function vs. function

자바스크립트에서는 기본적으로 Function(대문자로 시작한다)이라는 함수를 제공합니다.

이것은 함수 인스턴스를 생성하는 함수입니다.

Function 은 함수 인스턴스를 생성하는 함수이다.

"인스턴스(instance)"라는 용어는 "객체(object)"와 유사합니다.

다만, 의미상으로 "객체"는 좀더 일반적인 의미인 반면에 "인스턴스"라고 표현하면 "현재 생성된 바로 그 객체"라는 인스턴트(instant)한 뉘앙스로 좀 더 짙게 표현할 수 있습니다.


사실 Function 자체도 객체입니다. 

이렇다 보니 "Function 객체"라 하면 "Function 자체를 의미하는 것"인지 "Function에 의해 생성된 함수 객체를 의미하는 것"인지 구분이 모호할 때가 있습니다.

이러한 경우 "Function 인스턴스"라고 하면 일반적으로 후자를 일컫는 경우가 대부분입니다.

마찬가지로 "Object 인스턴스"라 하면 "Object 생성자로 생성된 객체"를 의미합니다.

그러나 Object 생성자의 주된 목적은 객체를 생성하는 것이므로 "Object 객체"라고 표현할 수도 있습니다.


인스턴스를 생성하는데 사용하는 함수를 특별히 생성자(constructor)라고 하는데 Object가 Object 인스턴스를 생성하는 생성자라면 Function은 함수 인스턴스를 생성하는 생성자라고 할 수 있습니다.

javascript
var add = new Function("x", "y", "return x+y;");

위 코드는 add라는 함수 인스턴스를 생성하는 표현입니다.

또한 이 표현은 다음과 같이 add 함수를 정의하는 것과 동일합니다.

javascript
function add(x, y) {
    return x + y;
}

프로그램이 실행되면 이 표현에 의해서도 add라는 함수 인스턴스가 생성되는 것입니다.

"함수를 정의한다는 것"과 "함수 인스턴스를 생성한다는 것"의 표현은 다르지만 의미상으로는 거의 동일하다고 할 수 있습니다.


Function 생성자를 호출할 때는 문자열 타입의 인자를 몇 개라도 전달할 수 있습니다.

마지막 문자열이 해당 함수의 구현 내용이 되며 마지막을 제외한 그 앞의 인자는 함수를 호출하는데 사용하는 인자입니다.


앞의 함수를 생성할 때 Function 을 이용하는 코드와 function 을 이용하는 코드를 보면 알겠지만 Function을 사용하기는 어렵습니다.

함수 본문이 길어진다면 마지막 인자에 문자열로 본문을 작성하는 것을 결코 쉽지 않은 일입니다.

따라서 함수를 정의할 때는 Fucntion 보다는 function을 주로 이용합니다.



Function vs. Object, Array

앞에서 정의된 함수 add가 Fucntion의 인스턴스이듯이 자바스크립트에서 제공하는 Object, Array도 Fucntion의 인스턴스입니다.

Object와 Array도 Function의 인스턴스다.

Function 생성자가 new 와 함께 사용되어 함수 인스턴스를 생성하듯이 Object와 Array 생성자는 new 와 함께 사용되어 각각 Object 객체와 배열 객체를 생성합니다.

javascript
var obj = new Object(); // Object 객체 생성
var arr = new Array(); // 배열 객체 생성

생성자 Object, Array 등을 흔히 "타입" 또는 "타입 객체"라고도 표현합니다. 

어떻게 표현하든 Object, Array 등은 결국 함수임을 기억할 필요가 있습니다.


Object 객체와 배열 객체를 생성하는 방법은 위와 같은 new와 생성자를 이용하는 방법 이외에 리터럴 표현을 사용할 수도 있습니다.

javascript
var obj = {}; // Object 객체 생성 리터럴
var arr = []; // 배열 객체 생성 리터럴

객체 리터럴과 배열 리터럴도 객체와 배열을 생성할 때 흔히 사용하는 방법입니다.


Object와 객체 리터럴이 Object 객체를 만들어내는 역할을 하는 반면 Function과 function은 함수 객체(function object), 즉 함수를 만들어 내는 역할을 한다.


Function 생성자에 전달된 마지막 문자열 인자가 함수의 실행 코드가 됩니다.

Object와 Function은 Object 객체와 함수 객체를 만들어내는 일종의 공장(factory)입니다.

그리고 Object 함수가 만들어내는 객체와 Function이 만들어내는 객체는 둘다 객체이지만 Function 객체는 "함수"라는 것입니다.


Object로 생성된 객체가 Object에서 정의한 멤버를 공유하듯이 Fucntion으로 생성된 함수는 모두 Function에서 정의한 멤버를 공유합니다.

Object, Array 생성자도 Function의 인스턴스로서 Function 에서 정의한 기본적인 멤버를 사용할 수 있습니다.

즉, 자바와 같은 객체지향 언어에서 모든 객체가 Object를 상속하듯이 자바스크립트에서는 모든 함수가 Function 을 상속한다는 의미입니다.


모든 함수는 Function에서 정의하는 멤버를 공유한다.


Function, Object 생성자(함수), Object 객체의 관계를 정리하면 다음가 같습니다.

Function → Object(Function 인스턴스) → Object 객체(Object 인스턴스)

Object도 함수 객체로서 Function 인스턴스이고 Object 함수를 이용하면 다시 Object 객체를 생성할 수 있다는 의미입니다.



Jaehee's WebClub



댓글을 달아 주세요

  1. 필오 2017.08.01 23:38

    정말 도움 많이 되었습니다!!! 감사합니다 :)

  2. lee 2020.02.14 15:11

    쉽게 설명이 되어있음에도 불구하고 인스턴스 개념이 잘 잡히지 않네요..ㅠㅠ
    인스턴스가 생성자 함수로 만들어진 객체를 의미하는게 맞나요?

    • BlogIcon 재희 jaiyah 신고">2020.03.16 11:23 신고

      네, 맞습니다 !
      인스턴스는 여러개 생성할 수 있는 장점이 있지만 메모리를 낭비할 수 있기 때문에 공통 로직을 잘 관리해야 합니다.