This content originally appeared on DEV Community and was authored by thatFemicode
Closures
Yes i finally found the courage to post about topics i have been learning and documenting about this past few months after. Its time i start putting my self out there and haring knowledge whilst learning because hoarding and not sharing what you have learnt as you continue on your journey wont help the next set of engineers coming in as there might be just that one person that processes information the same way you do, i myself, definitely not the smartest person so i have mechanisms that i use to study, for the better part of my coding journey i didnt really use my studying mechanism but rather used something i always labelled as Photographic memory to Understand concepts which i found out was not working for me, ever since going back to my default settings, lol, i began to get a good grasp of concepts very well, not to digress, this is a discussion for another day. Lets get into the main thing JAVASCRIPT CLOSURES. This will be really short
What are closures or what is a closure? ?
Closure can be simply defined as simply a function bundled together with reference to its LEXICAL ENVIRONMENT i.e.(Parent Scope). We probably use closures at times and we dont even know we do, hell i worked on something a while back and didnt even know ?
Lets look at it from this angle: a function which is a first-class object in JS has something like a family tree, the function in this case being the father built a house and has children in this case a child which is the function that is returning, those children or that child will always remember that house even after the father dies or in the case of our functions gets executed, because they were or he/she was brought up in that house, if the house has a chair, the children or child in this case the functions will always remember the color of the chair. Get it now? If you dont let us take simple function and explain this concept
function father(){
let chairColour = "red"
function childOne(){
console.log(chairColour)
}
return childOne
}
Calling father() will just be called or invoked but nothing will happen but calling father()() something like an IFFE will return the chairColor
or you can do something like this
let child = father()
child()
in this case we call the father, it gets executed and returns a child to continue with its Legacy, permit me to say this. Lol
then the child gets the child variable gets the returned function and can then be called
something like a the Scope chain where the returned function will look up its family tree and remember "Oh i cant find the variable or common thing in my own family house but its in my fathers house where i grew up". Not to make this very long as this is my first article and i would not want to bore you. so lets talk about the Advantages and disadvantages of function
ADVANTAGES
- Data Privacy and Encapsulation (Variables in functions that are not accessible outside that function)
- Memoize && Once (This two are higher order functions, i myself do not really know what they are lol, hopefully i get to explore them)
- Function currying
- Module pattern(A concept in JavaScript) Disadvantages
- Memory Leaks
- Overconsumption of memory because anytime a closure is formed because those closed variables are not garbage collected. It is just accumulating a lot of memory.
What is Garbage Collector?
It is a program in browser or JS engine which frees up unutilized memory because JS is a high level language.
Hopefully you get the gist of how closures behave now, i always had issues understanding it till i read up and watched some videos that really explained the concept well, like i said at the beginning there are people who process information different and if you are a junior dev out there like me, this is probably for you. Thank you for reading. If anyone reading this feel like i made a mistake or my thought process for this was not explanatory enough, I'd be glad to receive advice (constructive criticism) and learn more. Have a great day and journey ahead.
This content originally appeared on DEV Community and was authored by thatFemicode
thatFemicode | Sciencx (2021-08-16T11:48:01+00:00) JavaScript Closures. Retrieved from https://www.scien.cx/2021/08/16/javascript-closures/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.