var let const in Javascript Scope | Understanding Global Local Function Block Scope
ฝัง
- เผยแพร่เมื่อ 23 ก.ค. 2024
- Web Dev Roadmap for Beginners (Free!): bit.ly/DaveGrayWebDevRoadmap
In this video we'll compare the keywords var, let, and const in JavaScript which also requires an understanding of JavaScript scopes such as global scope, local scope, function scope, and block scope.
▶ This video is part of the JavaScript Tutorials for Beginners Playlist found here: • Javascript Tutorials f...
✅ Quick Concepts outline:
var, let, and const in Javascript
(00:00) Intro
(0:30) What makes var different
(1:40) What makes let different
(2:05) What makes const different
(2:35) A discussion of scope
(2:50) Global Scope
(3:25) Local Scope
(3:35) Block Scope
(4:00) Function Scope
(4:45) Local Scope variables declared with let or const are not available in global scope
(6:00) Nested block scope inside of a function
(7:05) Global scope variables are available in local scopes
(8:00) Global scope is available to all scopes
(8:25) If statements have block scopes
(8:35) for loops have block scopes
(8:45) switch statements have block scopes
(9:00) Review of scopes so far...
(9:50) A 2nd Example of global, function, and block scopes
(14:40) Note: var is function scoped; const & let are block scoped
(15:45) Review with helpful graphic :)
📚 Further Reading:
MDN Web Docs:
Scope: developer.mozilla.org/en-US/d...
Global Scope: developer.mozilla.org/en-US/d...
Local Scope: developer.mozilla.org/en-US/d...
Eloquent JavaScript Chapter 3:
eloquentjavascript.net/03_fun...
📺 More Beginner JS Videos:
freeCodeCamp: • Learn JavaScript - Ful...
Traversy Media: • JavaScript Crash Cours...
The Net Ninja: • Modern JavaScript Tuto...
✅ Follow Me:
Twitter: / yesdavidgray
Reddit: / daveoneleven
Medium: / davegray_86804
#var #let #const - วิทยาศาสตร์และเทคโนโลยี
Very detailed perfect lessons you have on your channel! I wish I found your channel earlier because not so many people explain basic foundational things so well. Good work :)
Thank you for the kind words, Alexander!
The best explanation of scope I have seen so far.
It could have avoided me all those "undefined" errors a few weeks ago.
Very good.
Glad it helped! 💯
Thanks, Dave !!
This one came via a link from my lecturer, but I have worked thru a number of your multi-hour videos previously. Your explanations have helped me to understand many of the core concepts of JavaScript programming and web development.
Wow! What a thorough explanation. Amazing Dave; by far the best on TH-cam.
Thank you, Faraz! 🙏🙏
Thanks Dave! Been looking at several videos on scopes by far the best.
You're welcome! 💯
Ive been having trouble with scope for the absolute LONGEST, everything else in javascript has made sense except that. The second example at 9:50 was spot on.
Glad to hear this helped!
Roadmap redirected me to your channel, what a tutorial!
Awesome tutorial..Thanks a bunch!
Amazing explanation. Great work Dave. Thank you.
You're welcome 🙂🙏
Sometimes, all you need is a video and it does the work of a whole pdf. Thanks man.
You're welcome!
thank you so much, your clear explanation made me understand the difference between var , let and cons. :)
Very understandable thanks a lot I liked your video thanks for creating this videos
wow, loved it
This is so detailed and easy to understand.Thank you
You're welcome!
Can't recommend enough your channel, well thought explanations, concise, thanks a lot for sharing
Much appreciated!
Thank you for explaining the concept of variable leaking ! Never knew this happens with var
Happy to help! 💯
Great explanation, thank you!!!
You're welcome!
Wonderfully compiled and delivered. Thanks for giving such crystal clarity in these fundamentals..
You're most welcome
Your videos are amazing !!!
Glad you like them! 💯🚀
Great explanation!
Glad it was helpful! 🚀
this is the best explanation on scope I have ever seen 🎉
Thank you!
You have a gift for teaching 💯
Thank you! 🙏🙏
Great explaination
Thank you!
This guy is the god of JS
Perfect
It might be considered as not the easiest topic but with your explanation it's clear! Thank you!
You're very welcome!
Thanks I am now clear
Happy to help!
Dang...I thought I knew this stuff...lol...good content...I learned a lot
Thanks!
Thank you, Dave! At 10:45 you marked three words "global" which are on seperate lines, and changed them simultaneously. How did you do that?
Highlight one of them and press Ctrl+D to select another. This is with VS Code on Windows.
Hi Dave, thanks for the teaching.
I've got a question, when I enter ${x}; in the console it shows ${x} instead of the value.
May I know if there is anyway to solve this? Thanks
${x} will cause an error if that's all you type in the console. Unexpected token. Not sure why you would do that? If you have defined x as a variable, just type x.
Hi! I've had a similar issue recently and it was caused by using quotes (no matter singular or double '/") instead of backticks ``.
Мне очень жаль, что мало понимаю английский язык. Но я все равно понимаю эти уроки потому что вы объясняете очень хорошо и детально огромная вам благодарность
Thank you for the kind words!
Var doesn't respect { } scope indeed! Thanks for pointing this out. And thanks for explaining that the notorious "block scope" simply means things like: if { } or for { } etc.
You're welcome! 🙏
Sir, there is also a module scope. I saw in dmitripavlutin article that module scope can also be nested. How can I able to nest a module scope?
You import modules. They do have their own scope. This should be covered in a future lesson. 💯
@@DaveGrayTeachesCode so, importing a module is called module scope nesting?
@@damo190 no, modules have scope. Functions can be within a module, too. Their scope would be inside (aka nested) the module. If you understand the scope discussion of this tutorial, it is all you need as a beginner 💯
Holy shit a youtube tutorial with a good microphone
let a = {f(){console.log(this);}};
Here, the value of 'this' depends from where the function f is called, not from where f is defined. So, I doubt 'this' is in dynamic scope. But I have already learned, JavaScript only supports lexical(static) scoping. That's why I am confused. Please help me.
In your example, "this" refers to the object you are creating. You will see this more clearly if you add a 2nd property like num: 10 or similar and then call the f method on the object a like: a.f() ..it will log the full object to the console. The "this" keyword can make things confusing in JS until you work with it for awhile.
@@DaveGrayTeachesCode so, this keyword is in which scope, lexical or dynamic?
Never underestimate the basics...
💯 Right!