(JavaScript Tutorials for Beginners)
In this end-to-end example, you will learn – JavaScript tutorials for Beginners – JavaScript Closures.
JavaScript Closures
In this tutorial, you will learn about JavaScript closures with the help of examples.
Before you learn about closures, you need to understand two concepts:
- Nested Function
- Returning a function
JavaScript Nested Function
In JavaScript, a function can also contain another function. This is called a nested function. For example,
// nested function example
// outer function
function greet(name) {
// inner function
function displayName() {
console.log('Hi' + ' ' + name);
}
// calling inner function
displayName();
}
// calling outer function
greet('John'); // Hi John
In the above program, the greet()
function contains the displayName()
function inside of it.
Returning a Function
In JavaScript, you can also return a function within a function. For example,
function greet(name) {
function displayName() {
console.log('Hi' + ' ' + name);
}
// returning a function
return displayName;
}
let g1 = greet('John');
console.log(g1); // returns the function definition
g1(); // calling the function
Output
function displayName() { console.log('Hi' + ' ' + name); } Hi John
In the above program, the greet()
function is returning the displayName
function definition.
Here, the returned function definition is assigned to the g1 variable. When you print g1 using console.log(g1)
, you will get the function definition.
To call the function stored in the g1 variable, we use g1()
with parenthesis.
JavaScript Closures
In JavaScript, closure provides access to the outer scope of a function from inside the inner function, even after the outer function has closed. For example,
// javascript closure example
// outer function
function greet() {
// variable defined outside the inner function
let name = 'John';
// inner function
function displayName() {
// accessing name variable
return 'Hi' + ' ' + name;
}
return displayName;
}
let g1 = greet();
console.log(g1); // returns the function definition
console.log(g1()); // returns the value
Output
function displayName() { // accessing name variable return 'Hi' + ' ' + name; } Hi John
In the above example, when greet()
function is called, it returns the function definition of displayName
.
Here, g1
is a reference to the displayName
function.
When g1()
is called, it still has access to the greet()
function.
When we run console.log(g1)
, it returns the function definition.
The concept of closure exists for other programming languages like Python, Swift, Ruby, etc.
Let’s have a look at another example.
// closure example
function calculate(x) {
function multiply(y) {
return x * y;
}
return multiply;
}
let multiply3 = calculate(3);
let multiply4 = calculate(4);
console.log(multiply3); // returns calculate function definition
console.log(multiply3()); // NaN
console.log(multiply3(6)); // 18
console.log(multiply4(2)); // 8
In the above program, the calculate()
function takes a single argument x
and returns the function definition of the multiply
function. The multiply()
function takes a single argument y
and returns x * y
.
Both multiply3
and multiply4
are closures.
The calculate()
function is called passing a parameter x
. When multiply3
and multiply4
are called, the multipy()
function has access to the passed x argument of the outer calculate()
function.
Data Privacy
JavaScript closure helps in the data privacy of the program. For example,
let a = 0;
function sum() {
function increaseSum() {
// the value of a is increased by 1
return a = a + 1;
}
return increaseSum;
}
let x = sum();
console.log(x()); // 1
console.log(x()); // 2
console.log(x()); // 3
a = a + 1;
console.log(a); // 4
In the above example, the sum()
function returns the function definition of the increaseSum
function.
The a variable is increased inside the increaseSum()
function. However, the value of the a variable can also be changed outside of the function. In this case, a = a + 1;
changes the value of the variable outside the function.
Now, if you want the a variable to be increased only inside the function, you can use a closure. For example,
function sum() {
let a = 0;
function increaseSum() {
// the value of a is increased by 1
return a = a + 1;
}
return increaseSum;
}
let x = sum();
let a = 5;
console.log(x()); // 1
console.log(x()); // 2
console.log(a); // 5
In the above example, the sum()
function sets the value of a to 0 and returns the increaseSum
function.
Because of the closure, even though sum()
is already executed, increaseSum()
still has access to a and can add 1 to a every time x()
is called.
And the a variable is private to the sum()
function. It means that the a variable can only be accessed inside of the sum()
function.
Even if you declare a
and use it, it does not affect the a
variable inside of the sum()
function.
Note: Generally, closures are used for data privacy.
Disclaimer: The information and code presented within this recipe/tutorial is only for educational and coaching purposes for beginners and developers. Anyone can practice and apply the recipe/tutorial presented here, but the reader is taking full responsibility for his/her actions. The author (content curator) of this recipe (code / program) has made every effort to ensure the accuracy of the information was correct at time of publication. The author (content curator) does not assume and hereby disclaims any liability to any party for any loss, damage, or disruption caused by errors or omissions, whether such errors or omissions result from accident, negligence, or any other cause. The information presented here could also be found in public knowledge domains.
Learn by Coding: v-Tutorials on Applied Machine Learning and Data Science for Beginners
Latest end-to-end Learn by Coding Projects (Jupyter Notebooks) in Python and R:
All Notebooks in One Bundle: Data Science Recipes and Examples in Python & R.
End-to-End Python Machine Learning Recipes & Examples.
End-to-End R Machine Learning Recipes & Examples.
Applied Statistics with R for Beginners and Business Professionals
Data Science and Machine Learning Projects in Python: Tabular Data Analytics
Data Science and Machine Learning Projects in R: Tabular Data Analytics
Python Machine Learning & Data Science Recipes: Learn by Coding
R Machine Learning & Data Science Recipes: Learn by Coding
Comparing Different Machine Learning Algorithms in Python for Classification (FREE)
There are 2000+ End-to-End Python & R Notebooks are available to build Professional Portfolio as a Data Scientist and/or Machine Learning Specialist. All Notebooks are only $29.95. We would like to request you to have a look at the website for FREE the end-to-end notebooks, and then decide whether you would like to purchase or not.