Do you know that you can define a function within a function in JavaScript? Furthermore, these functions defined in the outer function are not accessible outside the scope unless you expose them to the outside scope? This is pretty interesting since basic web tutorial doesn’t really cover function in a function with JavaScript. Function in a function are only noticeable when you come across or read about in the real world of JavaScript application.
Function within a function
How do you define a function within a function in JavaScript? Pretty simple and straight forward actually. Just throw another function into the function. This will caused the inner function to be accessible only within the scope of outer function.
function outer_func(){
function inner_func(){
alert('hellow');
}
//hellow will be alert
inner_func();
}
If you try to access the inner function, an undefined error will occurs. On the other hand, using the outer function still permits.
//undefined function
inner_func();
//alert 'hellow'
outer_func();
Access the inner functions
Sometimes we want some methods in the outer function to be accessible. We will have to return an object with the relevant method attached to it for it to be accessible outside the scope.
function outer_func(){
var newObj = new Object()
function inner_func(){
alert('hellow');
}
function inner_func2(){
alert('RAWR!');
}
newObj.inner_func = inner_func;
return newObj;
}
Above, we created two function and only attached the first function into the return object. Thus, calling the second function will fail.
var func_Obj = new outer_func();
// alert 'hellow'
func_Obj.inner_func();
//undefined
func_Obj.inner_func2();
Some Real World Application
Function within a function act as a security measure for certain action to be restricted outside the scope. Open source code tend to use this to prevent certain dependency methods from being access. Performing certain organization through this method was also applied in real life application.
|