mozilla
검색 결과

    Function

    현재 번역은 완벽하지 않습니다. 한국어로 문서 번역에 동참해주세요.

    요약

    JavaScript에 있는 모든 함수는 실제로 Function 개체입니다.

    Syntax

    다른 모든 객체들처럼, Function 객체는 new 구문을 통해서 만들 수 있습니다. : 

    new Function ([arg1[, arg2[, ...argN]],] functionBody)
    arg1, arg2, ... arg N
    Names to be used by the function as formal argument names. Each must be a string that corresponds to a valid JavaScript identifier or a list of such strings separated with a comma; for example "x", "theValue", or "a,b".
    functionBody
    A string containing the JavaScript statements comprising the function definition.

    Invoking the Function constructor as a function (without using the new operator) has the same effect as invoking it as a constructor.

    Description

    Function objects created with the Function constructor are parsed when the function is created. This is less efficient than declaring a function with a function expression or function statement and calling it within your code, because such functions are parsed with the rest of the code.

    All arguments passed to the function are treated as the names of the identifiers of the parameters in the function to be created, in the order in which they are passed.

    Note: Functions created with the Function constructor do not create closures to their creation contexts; they always are created in the global scope. When running them, they will only be able to access their own local variables and global ones, not the ones from the scope in which the Function constructor was called. This is different from using eval with code for a function expression.

    Invoking the Function constructor as a function (without using the new operator) has the same effect as invoking it as a constructor.

    Properties and Methods of Function

    The global Function object has no methods or properties of its own, however, since it is a function itself it does inherit some methods and properties through the prototype chain from Function.prototype.

    Function prototype object

    Properties

    Function.arguments
    An array corresponding to the arguments passed to a function. This is deprecated as property of Function, use the arguments object available within the function instead.
    Function.arity
    Used to specifiy the number of arguments expected by the function, but has been removed. Use the length property instead.
    Function.caller
    Specifies the function that invoked the currently executing function.
    Function.length
    Specifies the number of arguments expected by the function.
    Function.name
    The name of the function.
    Function.displayName
    The display name of the function.
    Function.prototype.constructor
    Specifies the function that creates an object's prototype. See Object.prototype.constructor for more details.

    Methods

    Function.prototype.apply()
    Applies the method of another object in the context of a different object (the calling object); arguments can be passed as an Array object.
    Function.prototype.bind()
    Creates a new function which, when called, itself calls this function in the context of the provided value, with a given sequence of arguments preceding any provided when the new function was called.
    Function.prototype.call()
    Calls (executes) a method of another object in the context of a different object (the calling object); arguments can be passed as they are.
    Function.prototype.isGenerator()
    Returns true if the function is a generator; otherwise returns false.
    Function.prototype.toSource()
    Returns a string representing the source code of the function. Overrides the Object.prototype.toSource method.
    Function.prototype.toString()
    Returns a string representing the source code of the function. Overrides the Object.prototype.toString method.

    Function instances

    Function instances inherit methods and properties from Function.prototype. As with all constructors, you can change the constructor's prototype object to make changes to all Function instances.

    Examples

    Function constructor

    The following code creates a Function object that takes two arguments.

    // Example can be run directly in your JavaScript console
    
    // Create a function that takes two arguments and returns the sum of those arguments
    var adder = new Function('a', 'b', 'return a + b');
    
    // Call the function
    adder(2, 6);
    // > 8
    

    The arguments "a" and "b" are formal argument names that are used in the function body, "return a + b".

    Specifications

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

    Example: A recursive shortcut to massively modify the DOM

    Creating functions with the Function constructor is one of the ways to dynamically create an indeterminate number of new objects with some executable code into the global scope from a function. The following example (a recursive shortcut to massively modify the DOM) is impossible without the invocation of the Function constructor for each new query if you want to avoid closures.

    <!doctype html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>MDN Example - a recursive shortcut to massively modify the DOM</title>
    <script type="text/javascript">
    var domQuery = (function() {
      var aDOMFunc = [
        Element.prototype.removeAttribute,
        Element.prototype.setAttribute,
        CSSStyleDeclaration.prototype.removeProperty,
        CSSStyleDeclaration.prototype.setProperty
      ];
    
      function setSomething(bStyle, sProp, sVal) {
        var bSet = Boolean(sVal), fAction = aDOMFunc[bSet | bStyle << 1],
            aArgs = Array.prototype.slice.call(arguments, 1, bSet ? 3 : 2),
            aNodeList = bStyle ? this.cssNodes : this.nodes;
    
        if (bSet && bStyle) { aArgs.push(''); }
        for (
          var nItem = 0, nLen = this.nodes.length;
          nItem < nLen;
          fAction.apply(aNodeList[nItem++], aArgs)
        );
        this.follow = setSomething.caller;
        return this;
      }
    
      function setStyles(sProp, sVal) { return setSomething.call(this, true, sProp, sVal); }
      function setAttribs(sProp, sVal) { return setSomething.call(this, false, sProp, sVal); }
      function getSelectors() { return this.selectors; };
      function getNodes() { return this.nodes; };
    
      return (function(sSelectors) {
        var oQuery = new Function('return arguments.callee.follow.apply(arguments.callee, arguments);');
        oQuery.selectors = sSelectors;
        oQuery.nodes = document.querySelectorAll(sSelectors);
        oQuery.cssNodes = Array.prototype.map.call(oQuery.nodes, function(oInlineCSS) { return oInlineCSS.style; });
        oQuery.attributes = setAttribs;
        oQuery.inlineStyle = setStyles;
        oQuery.follow = getNodes;
        oQuery.toString = getSelectors;
        oQuery.valueOf = getNodes;
        return oQuery;
      });
    })();
    </script>
    </head>
    
    <body>
    
    <div class="testClass">Lorem ipsum</div>
    <p>Some text</p>
    <div class="testClass">dolor sit amet</div>
    
    <script type="text/javascript">
    domQuery('.testClass')
      .attributes('lang', 'en')('title', 'Risus abundat in ore stultorum')
      .inlineStyle('background-color', 'black')('color', 'white')('width', '100px')('height', '50px');
    </script>
    </body>
    
    </html>
    

    Browser compatibility

    Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
    Basic support (Yes) (Yes) (Yes) (Yes) (Yes)
    Feature Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
    Basic support (Yes) (Yes) (Yes) (Yes) (Yes) (Yes)

    See also

    문서 태그 및 공헌자

    Contributors to this page: HunminKim, Wafe, teoli
    최종 변경: teoli,