Function 생성자는 새 Function 객체를 만듭니다. 이 생성자를 직접적으로 호출하여 동적으로 함수를 생성할 수 있으나 보안 문제와 eval과 비슷한 유사(훨씬 덜 심각한) 성능 문제가 발생할 수 있습니다. 하지만, eval과 달리 Function 생성자를 이용하면 전역 범위(global scope)에서 코드를 실행할 수 있고, 더 나은 프로그래밍 습관을 유도하며 더 효율적으로 코드를 최소화 할  수 있습니다.

모든 JavaScript 함수는 사실 Function 객체입니다. 이 사실은 (function(){}).constructor === Function 코드가 참을 반환하는 것에서 알 수 있습니다.

구문

new Function ([arg1[, arg2[, ...argN]],] functionBody)

매개변수

arg1, arg2, ... argN
함수에서 형식 인수 이름으로 사용할 이름입니다. 각 이름은 자바스크립트 식별자로 유효한 문자열이거나 쉼표(comma)로 구분된 그러한 문자열의 목록이어야 합니다. 예를 들어, "x", "theValue" 또는 "a,b".
functionBody
함수 정의를 구성하는 자바스크립트 문으로 이루어진 문자열.

설명

Function 생성자로 생성되는 Function 객체는 함수가 생성될 때 구문 분석(parsing)이 이루어집니다. 이는 함수 표현식(function expression)이나 function 문(function statement)으로 함수를 정의하고 코드 내에서 그 함수를 호출하는 것보다 덜 효율적인데, 그 이유는 Function 생성자로 생성된 함수는 호출하는 코드의 나머지 부분과 같이 구문 분석되기 때문입니다.

함수로 전달되는 모든 인수는 생성될 함수의 매개 변수 식별자 이름으로 전달되는 순서대로 처리됩니다.

(new 연산자를 사용하지 않고) 함수로써 Function 생성자를 호출하는 것은 생성자로 호출하는 것과 같습니다. 하지만, new 연산자가 제거됨으로써 코드의 크기를 약간(4 바이트 더 작게) 줄일 수 있으므로 Function에 대해서는 new 연산자를 사용하지 않는 것이 좋습니다.

Function의 속성과 메서드

전역 Function 객체는 자신의 메서드 또는 속성이 없습니다. 그러나, 그 자체로 함수이기에 Function.prototype에서 프로토타입 체인을 통해 일부 메서드 및 속성을 상속받습니다.

Function 프로토타입 객체

속성

Function.arguments
함수에 전달되는 인수(argument)에 해당하는 배열. 이는 Function의 속성으로 사라지므로(deprecated), 대신 함수 내에서 이용 가능한 arguments 객체를 사용하세요.
Function.arity
함수에 의해 기대되는 인수의 수를 지정하기 위해 사용됐으나 제거되었습니다. 대신 length 속성을 사용하세요.
Function.caller
현재 실행 중인 함수를 호출한 함수를 지정합니다.
Function.length
함수에 의해 기대되는 인수의 수를 지정합니다.
Function.name
함수명.
Function.displayName
함수의 표시명.
Function.prototype.constructor
객체의 프로토타입을 만드는 함수를 지정합니다. 자세한 사항은 Object.prototype.constructor 참조.

메서드

Function.prototype.apply()
함수를 호출하고 this를 제공된 값으로 설정합니다, 인수는 Array 객체로 전달될 수 있습니다.
Function.prototype.bind()
호출될 때 this를 제공된 값으로 설정하는 새로운 함수를 만듭니다, 새로운 함수가 호출됐을 때 주어진 순서로 모두 제공되는 선행 인수와 함께.
Function.prototype.call()
함수를 호출(실행)하고 this를 제공된 값으로 설정합니다, 인수는 그대로 전달될 수 있습니다.
Function.prototype.isGenerator()
함수가 생성기인 경우 true를 반환합니다; 그렇지 않으면 false를 반환합니다.
Function.prototype.toSource()
함수의 소스 코드를 나타내는 문자열을 반환합니다. Object.prototype.toSource 메서드를 재정의(override)합니다.
Function.prototype.toString()
함수의 소스 코드를 나타내는 문자열을 반환합니다. Object.prototype.toString 메서드를 재정의합니다.

Function 인스턴스

Function 인스턴스는 Function.prototype에서 메서드 및 속성을 상속받습니다. 모든 생성자와 마찬가지로, 생성자의 프로토타입 객체를 바꿈으로써 모든 Function 인스턴스에 변화를 줄 수 있습니다.

예제

Function 생성자에 인수 지정하기

다음 코드는 인수 두 개를 갖는 Function 객체를 생성합니다.

// 예제는 JavaScript 콘솔에서 직접 실행하실 수 있습니다

// 두 개의 인수를 가지고 그 둘의 합을 반환하는 함수 생성
var adder = new Function('a', 'b', 'return a + b');

// 함수 호출
adder(2, 6);
// > 8

인수 "a" 및 "b"는 함수 몸통(body)의 "return a + b"에 사용되는 형식 인수명입니다.

Function 생성자와 함수 선언의 차이

Function 생성자로 만들어지는 함수는 생성 컨텍스트에 대한 클로저(closure)를 생성하지 않습니다; 이들 함수는 항상 전역 범위에서 생성됩니다. 함수가 실행될 때, 자신의 지역 변수와 전역 변수에만 접근할 수 있으며 Function 생성자가 호출된 그 범위의 변수에는 접근할 수 없습니다. 이 점이 함수 표현식(function expression) 코드에서 eval을 사용하는 것과 다른 점입니다.

var x = 10;

function createFunction1() {
    var x = 20;
    return new Function('return x;'); // 여기서 |x|는 전역 범위에 있는 |x|를 참조함.
}

function createFunction2() {
    var x = 20;
    function f() {
        return x; // 여기서 |x|는 위의 지역에 있는 |x|를 참조함.
    }
    return f;
}

var f1 = createFunction1();
console.log(f1());          // 10
var f2 = createFunction2();
console.log(f2());          // 20

다음은 Function을 이용해 (최대한 간결하게) 외부 코드를 실행하는 "적절한" 방법입니다.

function makeFunction(code){
    return Function('"use strict";return ' + code)();
}
var add = makeFunction(
  "" + function(a, b, c){ return a + b + c } // 실제 코드에서는 이 부분을 별도 파일로 이동할 것.
);
console.log( add(1, 2, 3) ); // will log six

위의 코드 자체로는 완전히 비실용적이라는 점에 유의하시기 바랍니다. 위와 같이 Function을 잘못 사용해서는 절대 안됩니다. 대신, 위의 코드는 기본 스크립트가 존재하고 크기가 크며 선택적으로 로드될 수 백개의 모듈을 가진 모듈 로더와 같은 것을 단순화하는 예제로서만 의미가 있습니다. 사용자가 그 모듈들이 모두 다운로드될 때까지 기다리는 대신, 클라이언트 컴퓨터가 필요한 모듈만 다운로드함으로써 페이지를 초고속으로 로드할 수 있습니다. 또한, 많은 함수를 평가(evaluating)할 때, 함수를 개별적으로 평가하는 대신 한꺼번에 대량으로 평가하는 것이 좋습니다.

function bulkMakeFunctions(){
    var str = "", i = 1, Len = arguments.length;
    if (Len) {
        str = arguments[0];
        while (i !== Len) str += "," + arguments[i], ++i;
    }
    return Function('"use strict";return[' + str + ']')();
}
const [
    add,                        sub,                        mul,                        div
] = bulkMakeFunctions(
    "function(a,b){return a+b}","function(a,b){return a-b}","function(a,b){return a*b}","function(a,b){return a/b}"
);
console.log(sub(add(mul(4,3), div(225,5)), 7))

명세

Specification Status Comment
ECMAScript 1st Edition (ECMA-262) Standard Initial definition. Implemented in JavaScript 1.0.
ECMAScript 5.1 (ECMA-262)
The definition of 'Function' in that specification.
Standard  
ECMAScript 2015 (6th Edition, ECMA-262)
The definition of 'Function' in that specification.
Standard  
ECMAScript Latest Draft (ECMA-262)
The definition of 'Function' in that specification.
Draft  

브라우저 호환성

FeatureChromeEdgeFirefoxInternet ExplorerOperaSafari
Basic support Yes Yes1 Yes Yes Yes
arguments Yes Yes1 Yes Yes Yes
arity No No No No No No
caller Yes Yes18 Yes Yes
displayName ? ?13 ? ? ?
length Yes Yes1 Yes Yes Yes
name15141 No Yes Yes
prototype Yes Yes1 Yes Yes Yes
apply Yes Yes1 Yes Yes Yes
bind7 Yes4911.65.1
call Yes Yes1 Yes Yes Yes
isGenerator No No5 — 58 No No No
toSource No No1 No No No
toString Yes Yes15 Yes Yes
FeatureAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
Basic support Yes Yes Yes4 Yes Yes Yes
arguments Yes Yes Yes4 Yes Yes Yes
arity No No No No No No No
caller Yes Yes Yes4 Yes Yes Yes
displayName ? ? ?14 ? ? ?
length Yes Yes Yes4 Yes Yes Yes
name Yes Yes Yes4 Yes Yes Yes
prototype Yes Yes Yes4 Yes Yes Yes
apply Yes Yes Yes4 Yes Yes Yes
bind418 Yes411.56 Yes
call Yes Yes Yes4 Yes Yes Yes
isGenerator No No No5 — 58 No No No
toSource No No No4 No No No
toString Yes Yes Yes4 Yes Yes Yes

같이 보기

문서 태그 및 공헌자

이 페이지의 공헌자: moolow, urty5656, dolmoon, Netaras, teoli, HunminKim, Wafe
최종 변경자: moolow,