What are anonymous functions

JavaScript - Anonymous functions

Protection against duplicate variable names

Variables have traditionally been used with the keyword var Defined outside of functions, they are pumped into the global object without regard or scruples. If another script is then loaded that uses the same variable name, the script overwrites the first variable and we sink into a classic source of error.

In contrast, variables that are defined in functions live in their own shielded space. Before the new keyword appears let Anonymous functions were the simplest protection against duplicate variable names and accidental overwriting.

Function declarations

ECMAScript provides a whole spectrum of techniques for defining functions:

function sum (a, b) {return a + b; }
Anonymous function or function expression
let sum = function (a, b) {return a + b; }
Self-calling function
(function (a, b) {return a + b;}) ();
Constructor method
let sum = new Function ('a', 'b', 'return a + b'); console.log ("sum" + sum (10, 20));
Arrow function
var absValue = (number) => {if (number < 0)="" {="" return="" -number;="" }="" return="" number;="" }="" console.log="" (absvalue(-10));="" 10="" console.log="" (absvalue(5));="">

Anonymous function or function expression

An anonymous function has access to any variable that was visible when the function was defined, including local variables. That makes anonymous functions so easy.

While a function is usually declared a few lines above or below and is only executed when it is called, Javascript evaluates anonymous functions directly on the spot.

let sum = 500; let amount = 20; const set = 19; let mytwocents = function (amount, rate) {let vwst = amount * rate / 100; let sum = amount + vat; return sum; } console.log ('mytwocents' + mytwocents (20,19) + 'sum' + sum); mytwocents 23.8 sum 500

Anonymous functions replace the function call, but are otherwise noted in the same way as normal functions: Between the opening and closing curly braces there are the same statements that would have been in the normal function. Since they are inner functions, they do not allow access to instructions outside of the function in which they reside. Variables within the function cannot from the outside overwritten.

Anonymous functions are often used in the processing of events:

document.getElementById ('foo'). onclick = function () {}

We also know anonymous functions as parameters of functions from the event handlers addEventListener.

window.addEventListener ("click", function () {});

It even works without assignment:

(function () {let autor = 'Pratchett'; let titel = 'Nice notes'; let book = [author, title]; console.log ("book" + book.join (',')); })();

This notation creates a literal function that is not assigned a name. The full round brackets mean that the function is executed immediately - as if the function were called at this point. This is why one speaks of self-executing functions (the term "immediately executed function" would be better).

When executed, the function creates three variables, formats them, and outputs them. As soon as the function has been processed, the variables are destroyed and the global object remains unchanged.

With the help of anonymous functions, the script protects itself against overlapping and collision with other scripts. For this reason, anonymous and self-executing functions are one of the most important conventions in professional program development today.

Disadvantages of anonymous functions

  • Testing and debugging anonymous functions is not easy,
  • they cannot be used multiple times,
  • Without a name, anonymous functions do not give a description of their task at first glance,
  • Loss of structure, the code can appear mixed up.

External sources