CODEWITHSUNDEEP
javascriptangularjs
user603007
user603007

Reputation: 11794

where is the (function()) for?

I am looking at this very well written angularjs application.

In the controller definition he has used:

(function () {
    var MyController = function ($rootScope, $scope, $location, $routeParams, $timeout, config, dataService, modalService) {
        //do something
    }
    MyController.$inject = ['$rootScope', '$scope', '$location', '$routeParams','$timeout', 'config', 'dataService', 'modalService'];
    angular.module('app').controller('MyController', MyController);
}());

instead of (without function()):

app.controller('MyController',function(){
//
});

What does the (function()); actually accomplish?

what are the pros of doing it like this?

Upvotes: 0

Views: 75

Answers (3)

DevC
DevC

Reputation: 7423

self executing function are like "use it and forget". By default variables declared in the self executing function will only be available in the self executing function block, so you don't have to worry about them polluting your global scope. Also they don't need any event for execution

Upvotes: 0

eyelidlessness
eyelidlessness

Reputation: 63529

This is a self-executing function. The benefit is that variables declared with var are local to the function's scope and don't pollute the global scope.

var foo = 'something';
(function() {
    var foo = 'something else';
}());

foo; // 'something'
this.foo; // 'something'
window.foo; // 'something'

(For non-browser environments, window may be global or some other reference, or may not be accessible directly.)

There are many benefits to protecting the global scope. It means you won't interfere with other modules or libraries that may themselves live in the global scope, and it means you won't overwrite global properties that can cause unintended side-effects.

Consider this case:

var location = 'https://google.com/';

In the global scope, in a browser environment, this will cause the browser to load Google (and potentially destroy the current page's state). In a function scope (including a self-exeuciting function), it is perfectly safe.

(function() {
    var location = 'https://google.com/';
}());

The variable is assigned to memory and immediately discarded (designated for garbage collection).

Also worth noting: variables declared in the global scope, or assigned without declaration, are created as properties on the global object. Executed in the global scope, the following are all equivalent (notwithstanding above notes about the global object's name or availability):

foo = 'bar';
var foo = 'bar';
this.foo = 'bar';
window.foo = 'bar';

Upvotes: 2

Alexander
Alexander

Reputation: 20234

It is not "without function", but the function is stored in a variable.

The pro is that you can save some lines of code and improve readability a lot:

var refreshFull = function() {
    // 200 LoC
}
store.on('load',refreshFull);
store.on('remove',refreshFull);
store.on('filterchange',refreshFull);
...

Please note that the code will always have a function() somewhere... whether you write it inline or use a variable.

Upvotes: 0

Related Questions