// Create a counter function which has increment and getValue functionality
You might not understand it from this task, but this is a task regarding CLOSURES
Because u have a function where inside you have to store some value and you have 2 public methods
So we want to create our, for example, private account to function.
And this is private because with certain accounting side, which is not available outside.
Const privateCounter = () = {
}
And actually, this is just a function.
But if you hear an interview that you must do something inside function after you call
this function,
then you have a question regarding closure.
// Create a counter function which has increment and getValue functionality
const privateCounter = () => {
let count = 0;
return {
increment: (val = 1) => {
count += val;
},
getValue: () => {
return count;
}
};
};
This is the solution
And the public API is
return {
increment: (val = 1) => {
count += val;
},
getValue: () => {
return count;
},
};
};
of the private method
privateCounter
But the most interest in the idea of what we have inside this privateCounter, if we write here,
private counter, you can see that this is a function
and actually we don't have any access to this
property count.
So this property count in this case is private.
If we even write Counter in Console
We get an object with 2 values: getvalue() and increment()
No count property inside
So, this code is working, but it is tricky and complex, because it is a closure.
What does closure ever mean?
Closure means that we have access inside of a function to the outside scope, which actually
means here,
for example, inside increment by using count, and we don't have this count declared in
increment, it is declared on the top in privateCounter.
and exactly the same is happening in get value – using count declared on the top of parent
function.
We have this counter here on the top, not inside this function, which actually means closure
function
has access to all properties inside itself and all properties which were defined before.
Why it is important ? because actually with this single line
const counter = privateCounter();
we are creating a closure counter
We have a closure and we have this reference to this count variable inside.
This is why every singletime we call counter.getValue()
Or counter.increment();
it is working and it is referencing this count variable on the top.
And you might say okay, but it is sounding like magic.
If you say: I don't understand how it is working in JavaScript, and this is where console
directory can help
us.
Make in Console console.dir () it takes a function and see inside of counter.getValue() in
Scopes our Closure inside
getValue() is an oBject
other questions on Closures which might happen in the Interview
All the questions regarding Closures are exactly the same.
E.g.
You might be asked to create a function which will store inside a secret string,
And will return it, when we call this function again.
const privateSecret = () => {
const secret = 'foo'
// the secret is our Closure and for it to be avail from outside, we
must return it
return () => secret;
}
const getSecret = privateSecret()
// the trick here is that privateSecret gives a function back (not yet
called)
// now we will call getSecret and will call this way the function which is
returned from privateSecret
console.log(getSecret())
const secret = 'foo' is a closure which is available from the outside after we store in
property getSecret = privateSecret()
const getSecret = privateSecret()
// the trick here is that privateSecret gives a function back (not yet
called)
// now we will call getSecret and will call this way the function which is
returned from privateSecret
console.log(getSecret())
In this case we are storing this closure after the function was executed
Closures is a super popular pattern inside JavaScript. That why you need to know how to write
Closures
Was searching for Use Cases of Closures
https://dev.to/avwerosuoghene/understanding-closures-in-javascript-1dkb#:~:text=Closures%20are
%20powerful%20tools%20for,encapsulation%20and%20avoiding%20global%20variables.
Very good article
Data encapsulation, high-order functions- functional programming, event handling
https://dev.to/avwerosuoghene/understanding-closures-in-javascript-1dkb#:~:text=Closures%20are
%20powerful%20tools%20for,encapsulation%20and%20avoiding%20global%20variables.
Closures
A closure is the combination of a function bundled together (enclosed) with
references to its surrounding state (the lexical environment). In other words, a
closure gives you access to an outer function's scope from an inner function. In
JavaScript, closures are created every time a function is created, at function creation
time.
