Какова конструкция (function() {})() в JavaScript? - программирование

Какова конструкция (function() {})() в JavaScript?

Я знал, что это значит, но сейчас я боюсь...

Является ли это в основном выражением document.onload?

(function () {

})();
4b9b3361

Ответ 1

Это выражение для немедленного вызова функции, или сокращенно IIFE. Он выполняется сразу после его создания.

Он не имеет никакого отношения к любому обработчику событий (например, document.onload).
Рассмотрим часть в первой паре скобок: (function(){})();... это регулярное выражение функции. Затем посмотрите на последнюю пару (function(){}) () ; обычно это добавляется в выражение для вызова функции; в этом случае наше предыдущее выражение.

Этот шаблон часто используется при попытке избежать загрязнения глобального пространства имен, потому что все переменные, используемые внутри IIFE (как и в любой другой нормальной функции), не видны за пределами его области видимости.
Вот почему, может быть, вы перепутали эту конструкцию с обработчиком событий для window.onload, потому что его часто используют так:

(function(){
    // all your code here
    var foo = function() {};
    window.onload = foo;
    // ...
})();
// foo is unreachable here (its undefined)

Исправление, предложенное Гуффой :

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

Обновление Поскольку это довольно популярная тема, стоит упомянуть, что IIFE также может быть написано с помощью функции стрелки ES6 (как Гаджус указал в комментарии):

((foo) => foo)('foo value')

Ответ 2

Это просто анонимная функция, которая выполняется сразу после ее создания.

Это так же, как если бы вы назначили его переменной и использовали ее сразу после, только без переменной:

var f = function () {
};
f();

В jQuery есть аналогичная конструкция, о которой вы могли бы подумать:

$(function(){
});

Это краткая форма привязки события ready:

$(document).ready(function(){
});

Ответ 3

Немедленно вызываемое функциональное выражение (IIFE) сразу вызывает функцию. Это просто означает, что функция выполняется сразу после завершения определения.

Три распространенных формулировки:

// Crockford preference - parens on the inside
(function() {
  console.log('Welcome to the Internet. Please follow me.');
}());

//The OPs example, parentheses on the outside
(function() {
  console.log('Welcome to the Internet. Please follow me.');
})();

//Using the exclamation mark operator
//https://stackoverflow.com/a/5654929/1175496
!function() {
  console.log('Welcome to the Internet. Please follow me.');
}();

Если особых значений для возвращаемого значения нет, тогда мы можем написать:

!function(){}();  // => true
~function(){}(); // => -1
+function(){}(); // => NaN
-function(){}();  // => NaN

В качестве альтернативы это может быть:

~(function(){})();
void function(){}();
true && function(){ /* code */ }();
15.0, function(){ /* code */ }();

Вы даже можете написать:

new function(){ /* code */ }
31.new function(){ /* code */ }() //If no parameters, the last () is not required

Ответ 4

Объявляет анонимную функцию, затем называет ее:

(function (local_arg) {
   // anonymous function
   console.log(local_arg);
})(arg);

Ответ 5

То есть казнить немедленно.

так что если я сделаю:

var val = (function(){
     var a = 0;  // in the scope of this function
     return function(x){
         a += x;
         return a;
     };
})();

alert(val(10)); //10
alert(val(11)); //21

Скрипка: http://jsfiddle.net/maniator/LqvpQ/


Второй пример:

var val = (function(){
     return 13 + 5;
})();

alert(val); //18

Ответ 6

Эта конструкция называется Expression Expression Expression (IIFE), что означает, что она выполняется немедленно. Подумайте об этом как о функции, вызываемой автоматически, когда интерпретатор достигает этой функции.

Наиболее распространенный случай использования:

Одним из наиболее распространенных вариантов использования является ограничение объема переменной, сделанной с помощью var. Переменные, созданные с помощью var, имеют ограниченную функциональностью область, поэтому эта конструкция (которая является оболочкой функции вокруг определенного кода) будет гарантировать, что ваша область переменных не просачивается из этой функции.

В следующем примере счетчик не будет доступен за пределами непосредственно вызываемой функции, т.е. область действия count не будет вытекать из функции. Вы должны получить Reference Error, если вы попытаетесь получить доступ к нему за пределами функции, вызываемой немедленно.

(function () { 
    var count = 10;
})();
console.log(count);  // Reference Error: count is not defined

Альтернатива ES6 (рекомендуется)

В ES6 теперь мы можем иметь переменные, созданные с помощью let и const. Оба они являются блочными (в отличие от var, который является областью действия функций).

Поэтому вместо того, чтобы использовать эту сложную конструкцию IIFE для используемого случая, о которой я упоминал выше, теперь вы можете написать гораздо более простой код, чтобы убедиться, что область переменной не течет из вашего желаемого блока.

{ 
    let count = 10;
};
console.log(count);  // Reference Error: count is not defined

В этом примере мы использовали let для определения переменной count, которая ограничивает count блоком кода, который мы создали с фигурными скобками {...}.

Я называю это Curly Jail.

Ответ 7

(function () {
})();

Это называется IIFE (выражение для немедленного вызова функции). Один из известных шаблонов проектирования JavaScript, это сердце и душа современного шаблона Module. Как следует из названия, он выполняется сразу после его создания. Этот шаблон создает изолированную или закрытую область выполнения.

В JavaScript до ECMAScript 6 использовалась лексическая область видимости, поэтому IIFE использовался для имитации блока. (С ECMAScript 6 возможна блокобласть при введении ключевых слов let и const.) Справочник по проблеме с лексическим ограничением

Имитировать блокобзор с помощью IIFE

Выигрыш в производительности при использовании IIFE заключается в возможности передавать широко используемые глобальные объекты, такие как window, document и т.д., В качестве аргумента за счет сокращения поиска области действия. (Помните, что JavaScript ищет свойства в локальной области видимости и поднимается по цепочке до глобальной области видимости). Таким образом, доступ к глобальным объектам в локальной области сокращает время поиска, как показано ниже.

(function (globalObj) {
//Access the globalObj
})(window);

Ответ 8

Нет, эта конструкция просто создает область для именования. Если вы разбиваете его по частям, вы можете видеть, что у вас есть внешний

(...)();

Это вызов функции. Внутри круглой скобки у вас есть:

function() {}

Это анонимная функция. Все, что объявлено с помощью var внутри конструкции, будет видимо только внутри одной и той же конструкции и не будет загрязнять глобальное пространство имен.

Ответ 9

Это выражение, выведенное сразу же в Javascript:

Чтобы понять IIFE в JS, давайте сломаем его:

  1. Выражение: то, что возвращает значение
    Пример: попробуйте выполнить в консоли хром. Это выражения в JS.
a = 10 
output = 10 
(1+3) 
output = 4
  1. Выражение функции:
    Пример:
// Function Expression 
var greet = function(name){
   return 'Namaste' + ' ' + name;
}

greet('Santosh');

Как работает выражение функции:
- Когда JS-движок запускается в первый раз (Контекст выполнения - Создать этап), эта функция (с правой стороны = выше) не может быть выполнена или сохранена в памяти. Переменной "greet" присваивается значение "undefined" двигателем JS.
- Во время выполнения (Execution Context - Execute phase) объект funtion создается "на лету" (еще не выполнен), получает назначение переменной "greet" и может быть вызван с помощью "greet (" somename ")".

3. Немедленно вызывается выражение Funtion:

Пример:

// IIFE
var greeting = function(name) {
    return 'Namaste' + ' ' + name;
}('Santosh')

console.log(greeting)  // Namaste Santosh. 

Как работает IIFE:
- Обратите внимание на "()" сразу после объявления функции. Каждый объект funtion имеет прикрепленное к нему свойство "CODE", которое может быть вызвано. И мы можем вызвать его (или вызвать) с помощью скобок().
- Таким образом, здесь, во время выполнения (Контекст выполнения - Выполнение фазы), объект функции создается и выполняется одновременно. Так что теперь вместо переменной funtion вместо переменной funtion есть возвращаемое значение (строка)

Типичная утилита IIFE в JS:

Применяется следующий образец IIFE.

// IIFE 
// Spelling of Function was not correct , result into error
(function (name) {
   var greeting = 'Namaste';
   console.log(greeting + ' ' + name);
})('Santosh');
  • мы делаем здесь две вещи. a) Обертывание выражения функции внутри фигурных скобок(). Это означает, что синтаксический синтаксический анализатор все, что помещается внутри(), является выражением (выражение функции в этом случае) и является допустимым кодом.
    б) Мы вызываем эту функцию в то же время, используя() в конце ее.

Таким образом, эта функция создается и выполняется одновременно (IIFE).

Важная информация для IIFE:

IIFE сохраняет наш код в безопасности.
- IIFE, являясь функцией, имеет свой собственный контекст выполнения, то есть все переменные, созданные внутри него, являются локальными для этой функции и не разделяются с глобальным контекстом выполнения.

Предположим, что у меня есть другой JS файл (test1.js), используемый в моем приложении вместе с iife.js (см. Ниже).

// test1.js

var greeting = 'Hello';

// iife.js
// Spelling of Function was not correct , result into error
(function (name) { 
   var greeting = 'Namaste';
   console.log(greeting + ' ' + name);
})('Santosh');

console.log(greeting)   // No collision happens here. It prints 'Hello'.

Поэтому IIFE помогает нам писать безопасный код, где мы не сталкиваемся с глобальными объектами непреднамеренно.

Ответ 10

Это анонимная функция , вызывающая вызов.

Просмотрите описание W3Schools функции самозапускания.

Выражения функций можно сделать "самозапускающимися".

Самозапускаемое выражение вызывается автоматически (автоматически) без вызываемый.

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

Вы не можете самостоятельно вызывать объявление функции.

Ответ 11

Это самозапускающаяся анонимная функция. Он выполняется, пока он определен. Это означает, что эта функция определена и вызывает ее непосредственно после определения.

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

(function(obj){
    // Do something with this obj
})(object);

Здесь "объект", который вы передаете, будет доступен внутри функции "obj", поскольку вы захватываете его в сигнатуре функции.

Ответ 12

Начните здесь:

var b = 'bee';
console.log(b);  // global

Поместите его в функцию, и он больше не является глобальным - ваша основная цель.

function a() {
  var b = 'bee';
  console.log(b);
}
a();
console.log(b);  // ReferenceError: b is not defined -- *as desired*

Вызвать функцию немедленно - oops:

function a() {
  var b = 'bee';
  console.log(b);
}();             // SyntaxError: Expected () to start arrow function, but got ';' instead of '=>'

Используйте круглые скобки, чтобы избежать синтаксической ошибки:

(function a() {
  var b = 'bee';
  console.log(b);
})(); // OK now

Вы можете оставить имя функции:

(function () {    // no name required
  var b = 'bee';
  console.log(b);
})();

Это не должно быть сложнее, чем это.

Ответ 13

Автономная анонимная функция. Он выполняется, как только он создается.

Один короткий и фиктивный пример, где это полезно:

function prepareList(el){
  var list = (function(){
    var l = []; 
    for(var i = 0; i < 9; i++){
     l.push(i);
    }
    return l;
  })();

  return function (el){
    for(var i = 0, l = list.length; i < l; i++){
      if(list[i] == el) return list[i];
    }
    return null;
  }; 
} 

var search = prepareList();
search(2);
search(3);

Поэтому вместо создания списка каждый раз вы создаете его только один раз (меньше накладных расходов).

Ответ 14

Самоисполняемые функции обычно используются для инкапсуляции контекста и исключения совпадений имен. Любая переменная, которую вы определяете внутри (function() {..})(), не является глобальной.

Код

var same_name = 1;

var myVar = (function() {
    var same_name = 2;
    console.log(same_name);
})();

console.log(same_name);

производит этот вывод:

2
1

Используя этот синтаксис, вы избегаете столкновения с глобальными переменными, указанными в другом месте вашего кода JavaScript.

Ответ 15

Это называется IIFE - выражение для немедленного вызова функции. Вот пример, чтобы показать его синтаксис и использование. Он используется для охвата использования переменных только до функции, а не за ее пределами.

(function () {
  function Question(q,a,c) {
    this.q = q;
    this.a = a;
    this.c = c;
  }

  Question.prototype.displayQuestion = function() {
    console.log(this.q);
    for (var i = 0; i < this.a.length; i++) {
      console.log(i+": "+this.a[i]);
    }
  }

  Question.prototype.checkAnswer = function(ans) {
    if (ans===this.c) {
      console.log("correct");
    } else {
      console.log("incorrect");
    }
  }

  var q1 = new Question('Is Javascript the coolest?', ['yes', 'no'], 0);
  var q2 = new Question('Is python better than Javascript?', ['yes', 'no', 'both are same'], 2);
  var q3 = new Question('Is Javascript the worst?', ['yes', 'no'], 1);

  var questions = [q1, q2, q3];

  var n = Math.floor(Math.random() * questions.length)

  var answer = parseInt(prompt(questions[n].displayQuestion()));
  questions[n].checkAnswer(answer);
})();

Ответ 16

Еще один пример использования - это memoization, где объект кеша не является глобальным:

var calculate = (function() {
  var cache = {};
  return function(a) {

    if (cache[a]) {
      return cache[a];
    } else {
      // Calculate heavy operation
      cache[a] = heavyOperation(a);
      return cache[a];
    }
  }
})();

Ответ 17

IIFE (Немедленно вызывается выражение функции) - это функция, которая выполняется, как только script загружается и уходит.

Рассмотрим приведенную ниже функцию в файле с именем iife.js

(function(){
       console.log("Hello Stackoverflow!");
   })();

Этот код, указанный выше, будет выполнен, как только вы загрузите iife.js и напечатаете "Hello Stackoverflow!". на консоли разработчика.

Подробное объяснение см. Выражение выраженной функции (IIFE)

Ответ 18

Вызываемое оператором выражение (IIFE) - это функция, выполняемая сразу после ее создания. Он не связан ни с какими событиями, ни с асинхронным исполнением. Вы можете определить IIFE, как показано ниже:

(function() {
     // all your code here
     // ...
})();

Первая пара скобок function() {...} преобразует код в круглые скобки в выражение. Вторая пара круглых скобок вызывает функцию, полученную из выражения.

An IIFE также можно охарактеризовать как самозапускающуюся анонимную функцию. Его наиболее распространенное использование заключается в ограничении объема переменной, созданной с помощью var или инкапсуляции контекста, чтобы избежать столкновений имен.

Ответ 19

Причина, по которой используются самоизоляционные анонимные функции, никогда не должна вызываться другим кодом, поскольку они "устанавливают" код, который должен быть вызван IS (наряду с предоставлением возможностей для функций и переменных).

Другими словами, они похожи на программы, которые "делают классы" в начале программы. После того, как они создаются (автоматически), единственными доступными функциями являются те, которые возвращаются анонимной функцией. другие "скрытые" функции все еще существуют вместе с любым состоянием (переменные, заданные при создании области).

Очень круто.

Ответ 20

Благодарим вас за предоставление хорошей информации о том, что такое Expression Expression Expression (IIFE). Я нашел эту информацию, и я думаю, что это может быть полезно, и я просто хочу поделиться ею со всеми вами с сайта MDN: Строгий режим

Ответ 21

Следующий код:

(function () {

})();

называется выражением, вызываемым сразу же (IIFE).

Он называется выражением функции, потому что оператор ( yourcode ) в Javascript заставляет его выражать. Разница между выражением функции и объявлением функции следующая:

// declaration:
function declaredFunction () {}

// expressions:

// storing function into variable
const expressedFunction = function () {}

// Using () operator, which transforms the function into an expression
(function () {})

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

После того, как мы получим выражение, которое оценивает объект функции, мы можем немедленно вызвать объект функции с помощью оператора (). Например:

(function() {

  const foo = 10;        // all variables inside here are scoped to the function block
  console.log(foo);

})();

console.log(foo);  // referenceError foo is scoped to the IIFE

Ответ 23

Я думаю, что два набора скобок делают это немного запутанным, но я видел другое использование в примере с Google, они использовали что-то похожее, я надеюсь, что это поможет вам лучше понять:

var app = window.app || (window.app = {});
console.log(app);
console.log(window.app);

поэтому, если windows.app не определено, тогда window.app = {} выполняется немедленно, поэтому window.app присваивается {} во время оценки условия, поэтому результат app и window.app теперь становятся {}, поэтому вывод консоли:

Object {}
Object {}

Ответ 24

Обычно код JavaScript имеет глобальную область применения. Когда мы объявляем глобальную переменную в ней, есть шанс использовать ту же самую дублирующую переменную в какой-то другой области разработки для какой-то другой цели. Из-за этого дублирования может произойти какая-то ошибка. Таким образом, мы можем избежать этих глобальных переменных, используя немедленно вызывающее выражение функции, это выражение является самоисполняющимся выражением. Когда мы сделаем наш код внутри этого выражения IIFE, глобальная переменная будет похожа на локальную область видимости и локальную переменную.

Два способа мы можем создать IIFE

(function () {
    "use strict";
    var app = angular.module("myModule", []);
}());

ИЛИ ЖЕ

(function () {
    "use strict";
    var app = angular.module("myModule", []);
})();

В приведенном выше фрагменте кода "var app" теперь является локальной переменной.

Ответ 25

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

Ответ 26

(function() {})();

или же

(function() {}());

Выше синтаксис известен как IIFE (выражение немедленного вызова функции). Выше синтаксиса - функция JavaScript, которая запускается, как только она определена.

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

Первая - это анонимная функция с лексической областью действия, заключенная в оператор группировки(). Это предотвращает доступ к переменным в идиоме IIFE, а также изменение глобальной области видимости.

Вторая часть создает немедленно выполняющуюся функцию expression(), через которую движок JavaScript будет напрямую интерпретировать функцию.

// Example
var greet = 'Hola';

(function(name) {
     var greet = 'Hello';
     console.log(greet + ' ' + name)
}('Rahul'));

console.log(greet);

**Output**: Hello Rahul   
            Hola

Приведенный выше пример показывает, что глобальная область действия объекта не изменилась.