I recently watched a JavaScript video tutorial containing code similar to this one:
(function (){
var b = 10,
c = 20,
d = 50;
var e = function(){
return b + c + d;
};
return e();
}());
This is a mon JS coding pattern. The author said that this is an example of a procedural approach in Javascript code. I don't understand that, can you please explain.
I recently watched a JavaScript video tutorial containing code similar to this one:
(function (){
var b = 10,
c = 20,
d = 50;
var e = function(){
return b + c + d;
};
return e();
}());
This is a mon JS coding pattern. The author said that this is an example of a procedural approach in Javascript code. I don't understand that, can you please explain.
Share Improve this question edited May 25, 2016 at 13:46 ElGavilan 6,92416 gold badges30 silver badges36 bronze badges asked Nov 2, 2012 at 14:01 Miroslav TrninicMiroslav Trninic 3,4514 gold badges31 silver badges55 bronze badges 2-
1
That's extremely convoluted way to write
10 + 20 + 50
– Esailija Commented Nov 2, 2012 at 14:04 - 7 yes, but it is not about 10+20+50 – Miroslav Trninic Commented Nov 2, 2012 at 15:15
1 Answer
Reset to default 7Let's start by saying the above is a self-invoking anonymous function:
A self-invoking anonymous function runs automatically/immediately when you create it and has no name, hence called anonymous.
The above is a fairly poor example in my opinion, but consider the following change:
var f = (function (){
var b = 10,
c = 20,
d = 50;
var e = function(){
return b + c + d;
};
return e();
}());
console.log(f);
We've taken the above code and added a var f =
in front of the function. This returns the value of e()
from the inner function to f
and now you have a value f
to be used elsewhere. Since the variables b
, c
, d
, e
are declared within the function scope of the anonymous function, we can ensure that they will not be tampered with. This is a way to do private variables in JavaScript. Now say you had 10 + 20 + 50
may places within your code. You could run this anonymous function at the beginning and substitute those occurrences with f
. This idea of abstracting out code into various procedures is why it's referred to as Procedural Programming.
Procedural programming uses a structured approach to coding the program where the functionality of the program is broken down into a number of functions or subroutines to make it easier to follow and reduce the need to repeat code.
This is mainly used to make code easier to read, easier to follow/debug and lets you abstract monly used chunks of code into well written snippets of code.
Read more
Self-Invoking Functions
Purpose of Self-Invoking Functions
Procedural Programming
More Procedural Programming
and this moves you into Closures