• Saturday , 18 November 2017

Closures in JavaScript

Code Canyon



Link for all dot net and sql server video tutorial playlists
http://www.youtube.com/user/kudvenkat/playlists

Link for slides, code samples and text version of the video
http://csharp-video-tutorials.blogspot.com/2014/12/closures-in-javascript.html

In this video we will understand closures in JavaScript with an example.

What is a closure
A closure is an inner function that has access to the outer function’s variables in addition to it’s own variables and global variables. The inner function has access not only to the outer function’s variables, but also to the outer function’s parameters. You create a closure by adding a function inside another function.

JavaScript Closure Example

function addNumbers(firstNumber, secondNumber)
{
var returnValue = “Result is : “;
// This inner function has access to the outer function’s variables & parameters
function add()
{
return returnValue + (firstNumber + secondNumber);
}
return add();
}

var result = addNumbers(10, 20);
document.write(result);

Output : Result is : 30

The following code Returns the inner function expression

function addNumbers(firstNumber, secondNumber)
{
var returnValue = “Result is : “;
function add()
{
return returnValue + (firstNumber + secondNumber);
}
// We removed the parentheses. This will return the inner function expression without executing it.
return add;
}

// addFunc will contain add() function (inner function) expression.
var addFunc = addNumbers(10, 20);
// call the addFunc() function and store the return value in result variable
var result = addFunc();

document.write(result);

Returning and executing the inner function

function addNumbers(firstNumber, secondNumber)
{
var returnValue = “Result is : “;
function add()
{
return returnValue + (firstNumber + secondNumber);
}
// We removed the parentheses. This will return the inner function add() expression without executing it.
return add;
}

// This returns add() function (inner function) definition and executes it. Notice the additonal parentheses.
var result = addNumbers(10, 20)();

document.write(result);

Original source

3d Ocean

Related Posts

17 Comments

  1. priyanka shah
    July 7, 2017 at 05:57

    Thank you for such a nice explanation. I have a question, what happens if we remove return add from the addNumbers function without changing any code?

  2. Hanamant kj
    July 7, 2017 at 05:57

    can anybody tell me when i need to use closures…? and give me real world example where closure exist..?

  3. ng- Course
    July 7, 2017 at 05:57

    please make few video on "JavaScript Scoping and Hoisting"
    I really need that videos

  4. ng- Course
    July 7, 2017 at 05:57

    nice explanation

  5. sta bilo
    July 7, 2017 at 05:57

    i DON'T SEE why to remove PARENTHESES it is easier with return add(); and document.write( result); did not make any problem?

  6. Rashmi C S
    July 7, 2017 at 05:57

    Your putting great effort,really your videos are helpful, In less amount of time am able to learn many things,thank you so much 🙂

  7. Arthur Nicholson
    July 7, 2017 at 05:57

    Very well explained. But why do we need to use Closure? What is it for? Why is it important? There are many definitions of Closures.. "it retains state and scope after executes", it's simply a function that refer to a variable in its parent scope", "making your code more efficient by only creating single instance of objects".. too many definitions, and I don't know which one is true. Can you please explain what is the purpose of Closure and why we need to use it? Thanks!

  8. Abdul Shabbir
    July 7, 2017 at 05:57

    Thank you so much! I finally understand closures!

  9. Sarav A
    July 7, 2017 at 05:57

    Nice way of teaching bro! thanks for doing it, keep doing it.

  10. Isu Nas
    July 7, 2017 at 05:57

    You are a vey good teacher.you explain concepts very clear.thank u so much

  11. Prudvi Seshu
    July 7, 2017 at 05:57

    Beautifully explained. Great..!! Thanks a lot. Keep Going…..

  12. Colonel Bastian
    July 7, 2017 at 05:57

    best tut on closures. thank you.

  13. Knowideer
    July 7, 2017 at 05:57

    super tutorial on closures! many thanks!

  14. Jitendra Mahapatro
    July 7, 2017 at 05:57

    nice

  15. Shahnawaz Athar kazmi
    July 7, 2017 at 05:57

    respected venkat sir, we need reporting like crystal report + jquery .plz do as soon.thanx in advanced

  16. Muhammad Zarshid
    July 7, 2017 at 05:57

    Sir could we expect Reports in Asp.net.it may be crystal report. Thanks for effort is ur excellency 👍

Leave A Comment

You must be logged in to post a comment.