How do nested functions work in JavaScript

Product Support
, ,
#1

In JavaScript, how does a function work when defined within another function, as seen in JavaScript nested functions? For example, given the code:

function dmy(d) {
function pad2(n) {
return (n < 10) ? '0' + n : n;
}

return pad2(d.getUTCDate()) + '/' +
pad2(d.getUTCMonth() + 1) + '/' +
d.getUTCFullYear();
}

function outerFunc(base) {
var punc = "!";

//inner function
function returnString(ext) {
return base + ext + punc;
}

return returnString;
}

How does this JavaScript nested functions structure work? Additionally, is it possible to call pad2() from outside the dmy() function?

#2

In JavaScript, a function defined within another function—like pad2 within dmy—is called a nested function. I’ve worked quite a bit with JavaScript nested functions, and they’re a handy way to encapsulate logic within a function. This structure has access to its parent function’s variables and parameters through closures, which is why pad2 can access d within dmy. But JavaScript nested functions are also private to their parent function, so pad2 is not accessible outside dmy. This design provides a layer of encapsulation, meaning pad2 can’t be called directly from the outside world.

#3

Yes, there is a way to expose pad2 if you want to access it from outside dmy. You could return pad2 itself, which makes it accessible from the outer scope. Here’s how:

function dmy(d) {
    function pad2(n) {
        return (n < 10) ? '0' + n : n;
    }
    return pad2; // returning pad2 for external access
}

const pad2Access = dmy(new Date());
console.log(pad2Access(5)); // Output: 05

In this example, pad2 becomes accessible through the pad2Access variable, allowing you to bypass the usual scope restrictions of JavaScript nested functions. It’s a neat way to still use the inner function but make it accessible if needed.

#4

Alternatively, if pad2 is frequently needed outside of dmy, it may be simpler to define it in the outer scope entirely. By doing this, you avoid the limitations of JavaScript nested functions while keeping pad2 accessible globally:

function pad2(n) {
    return (n < 10) ? '0' + n : n;
}

function dmy(d) {
    return pad2(d.getUTCDate()) + '/' +
        pad2(d.getUTCMonth() + 1) + '/' +
        d.getUTCFullYear();
}

console.log(pad2(7)); // Output: 07

Defining pad2 outside dmy gives it a broader scope, making it accessible throughout the program without relying on the nested function structure. This approach is particularly helpful when you want pad2 available across different functions and avoid the private nature of JavaScript nested functions.