Hoisting in JavaScript and function scope issues with keyword var

Understanding Hoisting in JavaScript, also look at function scoping with keyword var.
In this tutorial we look at following issues with keyword var in ES5
- function scope issues
- Hoisting
- lack of const
Solution with keyword 'let' and 'const' in ES6 ( ES2015)

[@Sarmadfarhankhan]

whenever I have doubts in JavaScript , I think of techsith 😉

[@NishantGupta_Neo]

No one has explained Hoisting, let alone the reasons for hoisting in such a lucid manner !

[@Techsithtube]

I hope it cleared the concept for you . Thanks for watching Nishant!

[@NishantGupta_Neo]

techsith without a shadow of doubt!

[@anacarolinamedeiroslabeca2761]

Very nice video. Finally understood the issues of using var and the advantage of using ECMAScript 6 'let' keyword instead. Thank you very much!

[@Techsithtube]

Glad to know. Thanks for watching :)

[@UrbanBDKNY]

Thanks for the video. The best information I got from this video is that let is block scope. That goes a long way towards knowing how to use it and how it is different from var which is function scoped etc

[@joshrochon6243]

Wow, hilarious. When you brought up the thing about the interview. Had one today, they asked me about hoisting, and i didn't do so great, and now I'm here

[@himanshushah2683]

The best explanation in all the tutorials video. not found better than your explain.keep posting, keep sharing .

[@Techsithtube]

Thanks Himanshu for watching!

[@gaurab1247]

Thanks for making ours life tremendously easy.I have been watching all of your's tutorials and you have a great teacher in you.Keep it up.It would be great if you come up with some DS/Algo tutorial as well.

[@mdawadud3520]

I really appreciate it because it is more clear than all video i get over the internet and please show us a complete video course about zero to advance level. thanks

[@Techsithtube]

Shiplu I have a full course here udemy.com/js-masterclass/

[@vinodhpaul3870]

I really love the way you explain the most confusing concepts in js...Feels like you have the right choice of words that trigger my brain to understand..lol. I will make sure to follow your vids regularly. Keep posting cheers!!!!

[@subhashmahimaluri]

You are very good teacher, explained with examples. I have learned lot of things from your tutorials.

[@krishnat9767]

Excellent..simple and straightforward..

[@justyna6134]

I like your style of explaining the issues - respect ! Thank you !!!

[@Carl-yu6uw]

Mr T Sith, so clear, so useful, so thank you!

[@mahesh82398]

Best clarification of let and const keywords, i have seen so far. Thanks Sir :)

[@Techsithtube]

Thanks :)

[@MajidEltayebZ]

Thanks for your simple explanation, this really means you understand what you're talking about, keep going (Y).

[@piashmehedi]

techsith is simply best for javascipt :)

[@ahmedboutaraa8771]

your tutorials are art int itself

[@anishvijay6445]

I really enjoyed the video and understood all the concepts related hoisting and issues of constants

[@BigMoneySniper]

Your unbelievable man.... Straight up unbelievable. God has blessed us with hell of a JS Guru. I wont take this blessing for granted. Unbelievable should be your nickname brotha. Keep up the amazing work.

[@Techsithtube]

Thank you for watching! :)

[@shashankpandey1019]

Really a great tutorial , I have ever seen.

[@arpitdubey17]

i really appreciate your work....and your teaching skill are awesome....simple and easy to learn by you.....................thank you so much..........

[@damoon_az2465]

Great explanations, your video made hoisting much easier to understand:)

[@Techsithtube]

Thanks for watching! :)

[@ankitkumarvashist8991]

You are a great teacher , i have doubts even after watching other JS tutorial, as they teach the syntax only, not clarifying the doubts why we use any particular syntax what it does. #Love and Respect to you from INDIA.

[@Techsithtube]

I am glad it helped. THanks for watching and keep learning!

[@shyam123m]

Simple and perfect explanation. Thanks Sir.

[@indrajitmate2904]

Best simple n most understandable concept .....

[@xuelianwang5300]

Super Clear! Thank you!

[@prostoLelouch]

Thanks for this tutorial! You did a great job!

[@Techsithtube]

Thanks for watching!

[@edwinrodriguez9025]

great explanation about the scopes. Thanks

[@souravsuman2633]

It was very helpful sir ....... explanation was clear and perfect....

[@rakeshpatidar4426]

It's amazing, The way of representation is awesome.

[@Techsithtube]

Thanks for watching ! :)

[@anupsingh24]

Great video buddy, cleared my doubts.

[@mustaphag]

Excellent Video. Keep up the good job

[@vicentec1521]

Mozilla needs to hire you to simplify their documentation! Thank you very much!

[@hemantgajbe8366]

Thank you Sir for clearing concepts !!

[@davitjanashia9344]

Very clear and intelligent explanation! Thank you! 💡 👍🏻

[@83manosar]

yes bro

[@TheSuyashgupta]

felt happy after seeing the video, doubt cleared

[@quarter-lifecrisis5127]

so simple and informative ❤👍🏻 thank you

[@MylesGmail]

Awesome channel!

[@vohoangan6121]

Well explain so easy to understand, thank you so much

[@catherinecordova512]

This was so clear and helpful! Thank you!!!

[@Techsithtube]

Thanks for watching Catherine! :)

[@pramodkumarw]

Awesome example with simple explanation and presentation

[@Techsithtube]

Thanks for watching Pramod!

[@sahilarora7186]

That was clean sir. Thank you

[@naren6666]

Awesome tutorials...

[@dhilipkumar5867]

Nice explanation..keep doing the good work

[@utkarshkandpal5960]

Your videos are Vader Level!

[@Techsithtube]

the best way to explain the dark side of JavaScript :)

[@heshankumarasinghe3159]

Thank you. This video has been really helpful. I learnt new things......

[@Techsithtube]

Glad it was helpful! Thanks for watching!

[@vishnum9747]

Your videos are so informative keep uploading new videos

[@AmeerHamza-jy5ml]

Thnaks Respected Sir 🤗 Lot of Love from PAK

[@Techsithtube]

Keep on learning brother and thanks for the kind comment.

[@Paunitza]

Great explanation. Thank you!

[@Techsithtube]

Glad it was helpful! Thanks for watching!

[@rohil3023]

This helped me understand hoisting thanks alot :)

[@codeative]

You're amazing .. thank you

[@AngeliqueGia]

Best tutorial! Thanks

[@Techsithtube]

Thanks for watching Gia:)

[@shikharchaudhary6984]

Best explanation.

[@STUPIDYOUTUBE_AI]

great explanation, thank you.

[@tranhuy2304]

thank you for covering this, its really clear out everything i want to know. So near the end of the video when you declare the var y = 2 outside the function expression even though inside the function it already had the console.log for y before we initialize the y with 1 so thats when the hoisting kicked in rather than the lexicial scope rule where every outer environment can be accessed inside function so in this case the hoisting just declare the variable y and not initialize any value for the variable y so in this case undefined. So far i think javascript is the only language that one declare a variable in a global scope you can literally use it almost any where, javascript function is also an object itself. It would be nice to see you explain about the scope chain and closure🤔🤔But keep up the good work bro

[@Techsithtube]

I do have a video on both scope chain and closures. you can check it out. Thanks for watching!

[@Pm80334]

Best in business , fantastic to say the least▶️

[@Techsithtube]

Thanks Prasad for watching and an Awesome comment.

[@mohamedelhousany4960]

you are good resource to learn js

[@shilpasyal55]

Great Video. Thanks 😊

[@satyendrakannaujiya187]

Thanks great tutorial

[@faisaltalukder5425]

Effective Vedio for learning ✅

[@vishalprajapti3544]

Very helpful tutorial....

[@legendarygaming7790]

Great Video.

[@ganapathilana7069]

clear example. thanks

[@salmanmoin3588]

very nicely defined, pls keep on doing advanced JS topics incl arrow fn etc.

[@Techsithtube]

salman , I have tones of topics on JS inducing arrow functions and advance JavaScript. please check it out. THanks for watching!

[@yanivsalman9685]

this is the best video on that subject. i think you should do some udemy curses so you will se some money of your work!

[@Techsithtube]

Thanks . I am thinking of building a udemy course.

[@Dipenparmar12]

Great work... keep it up 💪😄😃

[@Techsithtube]

Thanks for watching buddy

[@zaibkhan4862]

Really help me :) Thank you

[@Techsithtube]

Thanks for watching :)

[@kaushikdalvi4641]

Thank you so much!

[@tathagata1000]

Good one, thanks

[@ashwinichougale3432]

Very nice video.

[@Techsithtube]

Thank you very much!

[@amanueltadesse1655]

the best place to look things

[@akshaysharma30498]

Who... Who... Would dislike this great video XD... The condition could be they didn't want to learn anything XD ....
Great explanation as always!

[@Techsithtube]

Thanks buddy. I appreciate the comment. Thanks for watching!

[@alinawaz4034]

nice Explanation

[@ScienceExploration101]

Ur the best

[@Techsithtube]

Thanks Ankit for a an awesome comment

[@davideugene7911]

Merci beaucoup. C'était très clair :)

[@Techsithtube]

Merci d'avoir regardé :)

[@davideugene7911]

:)
So you speak French?

[@Techsithtube]

Little bit. Few years ago, I stayed in Paris for few months. That's when I learnt french.

[@parasmaniseth7873]

Interviewer : do u watch techsith
Me: yes
Interviewer : you are hired

[@Techsithtube]

I hope that did really happened :)

[@parasmaniseth7873]

I have mentioned ur channel in the interview and got to know that interviewer also follows u🤪

[@redeeshrv3319]

Superb !!! Please do some videos on JavaScript common patterns

[@Techsithtube]

I do have plans for that. Will start making them soon.

[@gabovanlugo]

Awesome!

[@Techsithtube]

thanks for watching! :)

[@abhaysehgal5457]

awesome video sir....just one advice i want to give you please put this video in top of this playlist...as i started watching your playlist and in above videos you have used "let" then for finding difference between var and let takes a lot of time...but after watching this video i get completely understand the difference between these two...once again thank you so much...waiting for more videos :)

[@manojkumarganigapeta2966]

nice video it's really helping to me thanks sir , have you done any video on design patterns in javascript sir?

[@Techsithtube]

I am using design patterns in many places. Here are some of the videos.
call, apply and bind: ua-cam.com/users/edit?o=U&video_id=AYVYxezrMWA
Decorator pattern: ua-cam.com/video/_8wOde1fmEM/v-deo.html
Factory Pattern: ua-cam.com/video/DpGuDFK4xss/v-deo.html

[@neilpearce]

It's during the execution context, the JS engine will store all variable and function declarations in memory. Every function creates its own execution context and memory bank. That's why you can call/evoke a function before it is defined, because that declaration has already been stored. ;-)

[@Techsithtube]

yes, perfectly explained. :)

[@MahanteshGurav]

Thank you.

[@iqraabdulrauf3402]

good one

[@carlosw9379]

Thanks!

[@akbaralimajeed]

Nailed it

[@prakharmathur8431]

good job bro

[@Techsithtube]

Thanks for watching prakhar.

[@specsbattle1340]

Yep this was in my interview today lol.

[@Techsithtube]

Hope you answered it correctly. . :)

[@specsbattle1340]

@@Techsithtube not quiet, I was not too clear about the var behavior in functional scope vs block scope. Now I am much more clear on this topic thanks to you. I also watched and liked your setTimeout with var and let, that was the exact question she asked. I am also making videos on my channel about tech interviews, I think the best way to learn is to teach. Now I am more confident to go to any UI interviews because as far as I know, scope questions always come up and now I should able to explain the weird behavior of var.

[@jacksto123]

Thanks for the video. Is var still used often? Or is everyone using let and const now?

[@Techsithtube]

I think you should only use let and const. now that most browsers supports it.

[@100krishna100]

Thanks for the video. Can I know the difference between lexical scoping and function Closures?

[@Techsithtube]

lexical scoping means variable defined outside the function is available inside. Function closure is , when a function uses a variable defined outside because of the lexical scoping, it will hold it inside a thing call closure ( internally) , so if you return this function it will persists the value where ever its used. I do have few tutorials on it. one is called closure, another is function chaining and there is also a tutorial on function mixins which uses closures.

[@chirashankar4495]

Can you please explain the second part where you assign 2 to var y and then if you comment out the other assignment to the same variable the console.log would display 2.

[@amanansari5567]

great

[@deeproy7292]

thank you

[@woofwoofunited]

Well explained, thank you. Is there ever a usecase where you would rather use var instead of let?

[@Techsithtube]

You should not use 'var' at all . its anipattern.

[@woofwoofunited]

Thanks I use const or let instead, from experience though has there been a usecase where var is preferred to let. Im assuming no?

[@Techsithtube]

yes use let or const , and never use var.

[@woofwoofunited]

Thank you, well done on making such a good video!

[@swathikumar3074]

whenever create any variable with var keyword it will be added to window (dom) object directly so it will be available in that particular context var is like global variable. var v; console.log(window.v);-->u will get undefined not an error

[@Nonsequitor415]

thanks

[@angelcaru]

Another thing with var and let is:
var x = x; gives you a variable x with the value of undefined
but let x = x gives you Uncaught ReferenceError: Cannot access 'x' before initialization
at whateveryourfileis.js:whateverthelinenumberis:whateverthecolumnnumberis

[@Tofurskii]

good

[@nobir98]

I think 'let' do hoisting but it doesn't assign to default value undefined. it assign where the developer declared. I might be wrong though

[@av5226]

can someone explain the interview question ? why is y not 2 ? because of hoisting ??

[@DominicVictoria]

Uhm. Are they really garbage collected? How does function factories work then? doesn't function factories return a reference of an object that was created inside the factory?