Learn JavaScript Scoping In 10 Minutes

Подписаться 1,6 млн

Просмотров 58 тыс.

50% 1

One of the biggest mistakes JavaScript developers make is not fully understanding how scoping works. There are 4 different levels of scoping and if you don’t have a strong grasp of how they interact with each other it can be incredibly difficult to write complex JavaScript code. In this video I cover all 4 different levels of scoping in JavaScript and how you can use them to your advantage.
📚 Materials/References:
ES Modules Video: • JavaScript ES6 Modules
ES Modules Article: blog.webdevsimplified.com/202...
🌎 Find Me Here:
My Blog: blog.webdevsimplified.com
My Courses: courses.webdevsimplified.com
Patreon: / webdevsimplified
Twitter: / devsimplified
Discord: / discord
GitHub: github.com/WebDevSimplified
CodePen: codepen.io/WebDevSimplified
⏱️ Timestamps:
00:00 - Introduction
00:30 - What is a scope
02:12 - Global Scope
04:02 - Module Scope
05:53 - Block Scope
07:35 - Function Scope
08:55 - Using multiple variables with the same name
#Scoping #WDS #JavaScript

Опубликовано:

30 июн 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 73

@njayman Год назад

I started learning web development somewhere near 2019. I was still in my undergrad and learning from you. I also used to follow dev Ed, Traversy media, New Boston, Fireship and Net ninja. I have finally landed a job as a JavaScript developer and it's all thanks to you guys. I learn something new every time I watch your videos.

@usua1myanmarian Год назад

Way to go man.

@emmm_4465 Год назад

Congratulations!

@dimitargetsov9690 Год назад

@najish mahmud.With my full respect to You and to the authors listed above: please , edit Traverse to Traversy.Brad Traversy deservs it.

@DavidTheITGuy. 5 месяцев назад

How did you easily step in to use javascript basics into projects, it's hard for me here?.

@ori9390 Год назад

This is one of the best channels for those who want to learn the Web Development. Thanks for your efforts, Kyle!

@larrylam2914 Год назад

love this type of videos!! they are so informative while the topics may seem easy or general, but i learn things I didn't know every time

@daedalus5070 Год назад

Great one-stop video on scope. Wrote something the other day and scope was the only thing wrong with any of it!

@luisaborba4829 2 месяца назад

OMG you're video made so much more sense than the way my teacher was explaining scope to us at the bootcamp. Thank you so much Kyle!!

@gabrielv1856 Год назад

Hello Kyle, first and foremost, thanks a lot for simplifying things a lot with your tutorials and lessons. I cant recall for how long ive been watching your channel but its been a while... (times goes really fast man...) I am currently working on a personal project that driving me to scope hell. The thing is that certain parts of the code (not just variables and functions) must me accessible by other parts of the code but some shouldnt and thus causing a headache were to place the scope of what. Another problem is that i know that by now there are a "managable" amount of code i can handle but it will become a monster with all the different parts of the project

@lutho600 Год назад

Congratulations 🎊 man i didn't know you have more than 1 million subscribers. Your channel is very helpful, love from South Africa 🇿🇦

@Juzzyjuzzy Год назад

Great explanation. Thanks for the illustration.

@raymondbyczko Год назад

'let' is my friend. 'var' is subject to hoisting in the function context, which makes things messy I would think. Good work as always Kyle!

@ythshhshsbsnshegebwnebeben2142 Год назад

I know you mainly teach programming and best practices but i would really like to see a video about quickly designing restapis, documentations and databases from you. I know about openapi and a few gui editors and generators but it seems there are nearly no videos about the topic. If you need to designe a prototype backend with a hand full of schemas, yould you start in a Texteditor/IDE or would you choose a more or less automated process in which you define a schema once and use it to generate api, db and doc parts? If there is already a video from you about this topic i apologize, thx for reading and keep up the good work.

@AcrylicHorizonsAbstractArt Год назад

Great explanations for how scoping works! However I'd be hesitant to say you *should* be using module scoping. There are definitely use cases where it's beneficial, but for example I have applications where a lot of variables and data need to be accessible to other scripts running (tracking, analytics, etc) and module scoping would make that more of a pain, so we have a lot scoped globally. Either way, great video with great information!

@SchnippSchnappShnappi Год назад

Thank you I finally fully understood!

@carafachera4781 Год назад

Thank you Kyle !!

@MinistryofJavaScript Год назад

Great share as usual.

@Arabian_Epileptic Год назад

Thanks Kyle 💯

@ara-ara845 24 дня назад

well explained thanks alot... God bless

@NedumEze Год назад

Kyle is a born Teacher. Thanks, Bud

@BalaSubramanian-fl1fl Месяц назад

Amazing Explanation

@tejibel2800 Год назад

Hey Kyle, i'm returning to writing typescript after almost a decade. I love your videos! Great use of clean code. I see you barely use semi-colons. Could you explain or maybe make a short on when to use them? Keep up making the great content.

@JunGull Год назад

JS doesn't require semi-colons. As far as I know, it automatically places then when it's parsed. It's pretty much up to you if you want to add them manually or not.

@tejibel2800 Год назад

@@JunGull Thanks for the response. I didn't think it was just a style choice! I'll just assume that for now. If i ever find an exception i'll return here to share so.

@navidghasemi9685 Год назад

@@tejibel2800 they are not just style choices! sometimes you need them to avoid misunderstanding js

@DavidTheITGuy. 5 месяцев назад

Your passion is teaching code bro

@valeriousmonk654 Год назад

Thank you!

@sowjanyasiddamshetty1532 Год назад

Hi Kyle, could you please do a video on decorators in javascript?

@lakhveerchahal Год назад

Thank you Kyle

@hypernylium9782 Год назад

now, i know you are more of a javascript guy but hear me out. can you try to make a file uploader using html, css, javascript and php with a loading bar? btw love you content. watch all of you're videos 😅

@canerucar34 Год назад

thanks for videos

@busyrand Год назад

Agreed. He's amazing.

@masonnash9396 Год назад

Thanks Kyle!

@Fralleee Год назад

I was expecting some mentions about lexical scope and closures.

@emanuelecampora1999 Год назад

Can you make a video about promise scope?

@raymondbyczko Год назад

I like using the type="module" designation, and then do the import within it. If I then actively add imported functions to button click bindings (using a bit of jQuery), they do not go away, since they are in the DOM (correct me if I am wrong). Even though the module will go away after its processed. Something like this (just adding my 1 cent and excuse the blade notation). This is for a trail/trip planner app I am writing: import {stopAdvance, updateTrailList} from "/js/geolocation.js"; $('#trail_prev').click(()=>{ let current = $('#trail_controller_index_data').data('current'); if (current == 0) { return; } current = current - 1; updateTrailList(current, {{ $max }}, {!! count($list) !!}); $('#trail_controller_index_data').data('current', current); }); . . The above is recent working code fragment. If I recall doing the following does not work: Probably due to the inability to use *import* with the *src*.

@wpxpert98 Год назад

Thank you Kyler

@parekhnirajj123 Год назад

Plz make a video on class constructor and methods in js

@adebayoomolumo1938 Год назад

Congratulations on 1million

@Peywan Месяц назад

thank you!

@mushfiqaraf5079 Год назад

Can you post a video on "Glass website" tutorial with CSS? 🤐

@scienceandtechnology9379 11 месяцев назад

How can I recall a variable outside of the function scope?

@kastussha1418 Год назад

You've got 1million!!!

@HawkMcDork Год назад

cool, my question is, if i create (or change) a variable inside of a function and want to use that new variable OUTSIDE of the function, how do i do that?

@thatsawesome. Год назад

YESSIR!

@js-dev8682 Год назад

const and let use block scope while var use function scope

@aalaeytb Год назад

helpful😍

@sureshanandsekar4384 6 месяцев назад

In React projects , we actually added the type:"module" in package.json . we dont add it manually as far as i knew in react js projects. correct me i am wrong folks.

@saurabhs4743 Год назад

Bro also create videos on source control in vs code

@99baddar Год назад

Can you create a video or series of video for mern app with docker

@InezhInezh Год назад

Best 🙂

@deatho0ne587 Год назад

Things like TSlint normally throw Warnings in the case of multiple variables with the same name in the same file, due to it is a bad practice.

@alwysrite Год назад

if I create a js file, how do I know if it is module scope or not?

@ashkanahmadi Год назад

It's never a module unless you specifically specify type="module"

@Harish-rz4gv Год назад

Do javascript have statistics module?

@jesusmanueldelvallepedros2608 Год назад

1:45 I tried the exact same code but I keep getting the following error message "SyntaxError: Cannot declare a const variable twice:" Any help would be appreciated 😀

@bananatop6059 Год назад

I just watched your "JavaScript ES6 Arrow Functions Tutorial". You say that you should always use arrow function unless you have a good reason not to. In most of your recent videos you use functions, not arrow function. Have you had a change of mind?

@shifronim8950 Год назад

Hi, check up your sound. Something eating your words, listen 11:00

@collinl.179 Год назад

I can not see the video, (only sound).

@harunjonuzi 9 месяцев назад

Why did he write moduleScript.js, but that .js file was actually not declared in the html file?

@sureshanandsekar4384 6 месяцев назад

That is just to show case the module concepts like exports , imports . it s not necessary to load it in .html file. as far as i know

@geetanshusharma3727 Год назад

I am here

@marvinjones689 Год назад

Do u mentor

@adarsh-chakraborty Год назад

First?

@eduardoburquezsanz1910 Год назад

Hi! I like your channel, but you talk so fast, I'm not native english speaker and can't follow you, but it's very interesting for me. I've to put on you the speed to .75 Please!