Function

这篇翻译不完整。请帮忙从英语翻译这篇文章

概述

Function 构造器创建一个新的Function 对象. 在JavaScript中每个函数(function)实际是一个Function对象.

构造器

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

参数

参数1, 参数2, ... 参数N
被函数使用的参数的名称必须是合法命名的。参数名称是一个有效的JavaScript标识符的字符串,或者一个用逗号分隔的有效字符串的列表;例如“×”,“theValue”,或“A,B”。
函数体
一个含有包括函数定义的JavaScript语句的字符串。

描述

使用Function构造器生成的Function对象是在函数创建时被解析的。这比你使用函数声明(function)并在你的代码中调用低效,因为使用函数语句声明的function是跟其他语句一起解析的

所有被传递到构造函数中的参数,都将被视为将被创建的函数的参数,并且是相同的标示符名称和传递顺序。

注意: 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. 

以调用函数的方式调用Function的构造函数 (不是用new关键字) 跟以构造函数来调用是一样的.

Function的属性和方法

全局的Function对象没有自己的属性和方法, 但是, 因为它本身也是函数,所以它也会通过原型链从Function.prototype上继承部分属性和方法。

Function的原型

属性

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.

方法

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的实例

Function 实例从 Function.prototype继承了一些属性和方法。 跟所有的构造函数一样, 你可以通过改变构造函数的原型对所有的Function实例的属性和方法进行更改。

例子

例子: 传入参数调用Function构造函数

下面的代码会创建一个需要两个参数的Function对象

// 可以直接运行在 JavaScript 控制的代码例子

// 创建了一个能返回两个参数和的函数
var adder = new Function("a", "b", "return a + b");

// 调用函数
adder(2, 6);
// > 8

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

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>

Specifications

Specification Status Comment
ECMAScript 1st Edition. Implemented in JavaScript 1.0 Standard Initial definition.
ECMAScript 5.1 (ECMA-262)
Function
Standard  
ECMAScript 2015 (6th Edition, ECMA-262)
Function
Standard  

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

文档标签和贡献者

向此页面作出贡献: FredWe, teoli, chbdetta, chyee, ziyunfei, iwo
最后编辑者: FredWe,