--- title: Function slug: Web/JavaScript/Reference/Global_Objects/Function tags: - JavaScript - Конструктор - Функция translation_of: Web/JavaScript/Reference/Global_Objects/Function ---
{{JSRef("Global_Objects", "Function")}}

{{JSRef}}

Function constructor создаёт новый объект Function. Вызов constructor создаёт функцию динамически, но страдает от проблем безопасности и аналогичных (но гораздо менее значительных) проблем производительности {{jsxref("eval")}}. Однако, в отличие от eval, конструктор функций создаёт функции, которые выполняются только в глобальной области..

{{EmbedInteractiveExample("pages/js/function-constructor.html")}}

Каждая функция JavaScript на самом деле является объектом функции. Это можно увидеть с помощью кода (function(){}).constructor === Function которая возвращает true.

Синтаксис

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

Параметры

arg1, arg2, ... argN
Имена, используемые функцией в качестве имён формальных аргументов. Каждое имя должно быть строкой, представляющий допустимый идентификатор JavaScript, либо списком таких строк, разделённых запятой; например "x", "theValue" или "a,b".
functionBody
Строка, содержащая инструкции JavaScript, составляющие определение функции.

Описание

Объекты Function, созданные конструктором Function, разбираются при создании функции. Это менее эффективно определения функции при помощи выражения function или инструкции function и вызова её внутри вашего кода, поскольку такие функции разбираются вместе с остальным кодом.

Все аргументы, переданные в функцию, трактуются как имена идентификаторов параметров создаваемой функции, и имеют тот же порядок следования, что и при их передаче в конструктор функции.

Примечание: функции, созданные конструктором Function, не создают замыканий на их контексты создания; они всегда создаются в глобальной области видимости. При их вызове, они получат доступ только к своим локальным переменным и переменным из глобальной области видимости, но не к переменным в той области видимости, в которой вызывался конструктор Function. Это поведение отличается от поведения при использовании функции {{jsxref("Global_Objects/eval", "eval")}} с кодом создания функции.

Вызов конструктора Function как функции (без использования оператора new) имеет тот же самый эффект, что и вызов его как конструктора.

Свойства и методы объекта Function

Глобальный объект Function не имеет собственных методов или свойств, однако, поскольку он сам является функцией, он наследует некоторые методы и свойства через цепочку прототипов объекта {{jsxref("Function.prototype")}}.

Прототип объекта Function

Свойства

{{page('/ru/docs/Web/JavaScript/Reference/Global_Objects/Function/prototype', 'Properties')}}

Методы

{{page('/ru/docs/Web/JavaScript/Reference/Global_Objects/Function/prototype', 'Methods')}}

Экземпляры объекта Function

Экземпляры объекта Function наследуют методы и свойства из объекта {{jsxref("Function.prototype")}}. Как и со всеми другими конструкторами, вы можете изменить объект прототипа конструктора для применения изменений ко всем экземплярам объекта Function.

Примеры

Пример: указание аргументов в конструкторе Function

Следующий код создаёт объект Function, который принимает два аргумента.

// Пример может быть запущен непосредственно в вашей консоли JavaScript

// Создаём функцию, принимающую два аргумента, и возвращающую их сумму
var adder = new Function('a', 'b', 'return a + b');

// Вызываем функцию
adder(2, 6);
// > 8

Аргументы "a" и "b" являются именами формальных аргументов, которые используются в теле функции, "return a + b".

Пример: рекурсивное сокращение для массового изменения DOM

Создание функции через конструктор Function - это один из способов динамического создания из функции неизвестного количества новых объектов с некоторым выполняемым кодом в глобальной области видимости. Следующий пример (a рекурсивное сокращение для массового изменения DOM) был бы невозможен без вызова конструктора Function для каждого нового запроса, если вы хотите избежать использования замыканий.

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Пример MDN - рекурсивное сокращение для массового изменения 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>Некоторый текст</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>

Спецификации

Спецификация Статус Комментарии
ECMAScript 1-е издание. Стандарт Изначальное определение. Реализована в JavaScript 1.0.
{{SpecName('ES5.1', '#sec-15.3', 'Function')}} {{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-function-objects', 'Function')}} {{Spec2('ES6')}}

Совместимость с браузерами

{{Compat("javascript.builtins.Function")}}

Смотрите также