The usage of function (function(parameter) {

Question

I have a couple questions about the below code:

What kind of function is this that has brackets on left side but no name before function ? Is this a special kind of function ?
Basically this function accepts callback as listeners, is it defined and run together ?

_

 (function(handlers) {
  Object.keys(handlers).forEach(function(observableName) {
    var observable = app.ko.observable().extend({
      notify: 'always'
    });
    that[observableName] = observable;
    var f = handlers[observableName];
    if (f) {
      observable.subscribe(f);
    }
  });
})({
  onCallIgnored: defaultCallHandler,
  onCallStateChanged: function(call) {
    that.videoState(call.getRemoteVideoState());
  },
  onPlacingCall: function(call) {
    callParams = app.utils.cloneObj(call);
  },
  onIncomingCall: function(call) {
    that.activeCall = call;
    callParams = app.utils.cloneObj(call);
    setCallEstablishingTimeout();
    app.playSound("ringtone");
    that.callProgressTime("");
  },
  onUpdateCallInfo: function(call) {
    console.log(call);
  }
});

https://stackoverflow.com/questions/3755606/what-does-the-exclamation-mark-do-before-the-function — epascarello, May 24 '18 at 12:32
Possible duplicate of [var functionName = function() {} vs function functionName() {}](https://stackoverflow.com/questions/336859/var-functionname-function-vs-function-functionname) — Richard-Degenne, May 24 '18 at 13:01

score 1 · Accepted Answer · edited Jun 20 '20 at 09:12

1

The function

(function(handlers) {
  ...
})()

is a self-executing anonymous function(also known as Immediately Invoked Function Expression). See this tutorial for good explanation.

When this code is executed by the JS interpreter it will define and call the function immediately with the set of handlers you are passing as parameters.

edited Jun 20 '20 at 09:12

Community

1
1

answered May 24 '18 at 12:39

mfilimonov

587
4
18

Try "Immediately Invoked Function Expression" – Stuart May 24 '18 at 12:41
Same idea different wording, no? – mfilimonov May 24 '18 at 12:44
It should be `(function (handlers) { ... })()` – attempt0 May 24 '18 at 12:44
1

Without the `()` behind it, it will not be invoked – attempt0 May 24 '18 at 12:46
Tanks. wikipedia says that until recently JavaScript had only function scope but not block scope, so this kind of usage is not needed with latest javascript ? – Rasim Avcı May 24 '18 at 12:52

score 1 · Answer 2 · answered May 24 '18 at 13:20

What kind of function is this that has brackets on left side but no name before function ? Is this a special kind of function ?

The function is an anonymous function which is converted as a function expression by wrapping () around it. And by adding another (), you are invoking the function expression. Such invoked function expressions are knows as IIFE (Immediately Invoked Function Expression) which means you invoke the function as soon as it is defined.

e.g.

(function(x) {console.log(x);})(2); // paints 2

Basically this function accepts callback as listeners, is it defined and run together ?

Yes, the function is defined and run together. IIFE takes the values defined in () as arguments and pass it to the function.

(function(arg1, arg2, ...argN){ ... // function definition})(param1, param2, ... paramN);

So, the breakup of the IIFE will be as follows

function defintion

function(handlers) {
  Object.keys(handlers).forEach(function(observableName) {
    var observable = app.ko.observable().extend({
      notify: 'always'
    });
    that[observableName] = observable;
    var f = handlers[observableName];
    if (f) {
      observable.subscribe(f);
    }
  });
}

function argument 1 (handlers)

{
  onCallIgnored: defaultCallHandler,
  onCallStateChanged: function(call) {
    that.videoState(call.getRemoteVideoState());
  },
  onPlacingCall: function(call) {
    callParams = app.utils.cloneObj(call);
  },
  onIncomingCall: function(call) {
    that.activeCall = call;
    callParams = app.utils.cloneObj(call);
    setCallEstablishingTimeout();
    app.playSound("ringtone");
    that.callProgressTime("");
  },
  onUpdateCallInfo: function(call) {
    console.log(call);
  }
}

The usage of function (function(parameter) {

2 Answers2