JavaScript var, let, and const explained

Поделиться
HTML-код
  • Опубликовано: 24 ноя 2024

Комментарии • 119

  • @fred02495
    @fred02495 6 месяцев назад +163

    const until you can't

    • @GS7999
      @GS7999 6 месяцев назад +8

      Well said buddy.

    • @danj8404
      @danj8404 6 месяцев назад +4

      Fully agree

    • @Mr.RobotHead
      @Mr.RobotHead 6 месяцев назад +2

      Yup, and just about any linting config will say the same.

    • @Dorchwoods
      @Dorchwoods 6 месяцев назад +7

      Yup, and then use let :)

  • @FurryDanOriginal
    @FurryDanOriginal 4 месяца назад

    As a developer who strongly prefers the functional paradigm, it's save to say that my opinions often times differ with Chris', but I always enjoy watching him and gaining insight on what other developers may lay value on. I also appreciate how he seperates facts from opinions and lays them out very clearly.

  • @ksaenable
    @ksaenable 6 месяцев назад +1

    Just wanna say how great of an explainer Chris Ferdinandi is. I purchased some of his courses and they were the only ones that really clicked for me in understanding JavaScript. Even sometimes when I hit a barrier of knowledge, Chris's site is my first go-to to check if he has a Blogpost or course about it.

  • @stevenstraker5105
    @stevenstraker5105 6 месяцев назад +2

    After working with languages like C and C++, I started thinking of variables as pointers of memory storage, rather than value storage.
    With that mindset, const is a constant reference to a memory pointer that can't be reassigned, but object properties/qualities stored in the pointer can be altered. This explains why arrays and objects (and scalar prototypes) can be changed, but scalar values cannot.
    I also subscribe to const primarily, but I'm generally biased towards OOP, where most variables I work with are objects anyway, so I make very limited use of let. An example of such limited use is with traditional for and while loops, though for arrays of objects, using const (for const x of y {...}) is just fine.

  • @CristianKirk
    @CristianKirk 6 месяцев назад +12

    I use const for constants and var for variables :D
    By the way, I fully support JS content on this channel. (Pure JS, not that crap from frameworks).

  • @scottborrowman
    @scottborrowman 6 месяцев назад +26

    I, personally, prefer const over let and only use let if I need the variable to change within a single iteration of the function. I tend to set up const with a ternary if I need it conditional different for that single iteration but will always be that value for that iteration.

    • @deatho0ne587
      @deatho0ne587 6 месяцев назад +1

      Never let your ternaries get out of hand. If it is more than one ? & a : then it most likely to complex to read in another month.
      I agree with you for the most part though.

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

      @@deatho0ne587 Yup. Usually a rare case a const can have more than 2 options, though. And if it does, it usually means you need more variables to break down everything that is going on.

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

      I agree with you. Just do not want people doing something that can be hard to maintain.

  • @Turabbo
    @Turabbo 6 месяцев назад +5

    Another really fun one dude!
    I do interviewing for my job and if I was to offer some unsolicited advice; a few more affirmation noises from you would really help ease the tension in these guest videos. Whenever you nod and smile, pairing it more frequently with a sound like "ahh", "uhuh", "got it!" goes a long way to keep you present in the dialogue and confirm to the guest subconsciously that this is still a conversation. They're a guest after all, so we're watching two people not one.
    Additionally, looking directly into the lens is lovely when you're just addressing us, but you'll notice that none of your guests do that. They're always looking at you, but slightly off to the side. This is just standard learned body language for video calls, so if your guest is doing it, you should probably mirror it.
    And I really love when you interject to clarify things it's really helpful.

    • @Nitrxgen
      @Nitrxgen 5 месяцев назад +1

      I'm glad Kevin doesn't repeatedly vocalise acknowledgement on points, I feel like once I start noticing that it will become too distracting and I'll keep thinking to myself "Dude shut up and just let him talk." Although it's a guest video, I don't think it's meant to have an interview theme. I'm personally more focused on the delivery of raw information than the video presentation surrounding the content delivery. I've been a interviewee a number of times in programming roles with non-technical interviewers and feel like I get discriminated against because I'm not that social, I'm a quiet person, I'm not an open book, I'm very privacy-focused, I'm conservative and keep personal traits to myself, but I do know how to program and am very confident with it, but tend to have difficulties with interviews so I don't think making a video like this interview-focused is relatable or a good idea at all.

    • @heinzerbrew
      @heinzerbrew 5 месяцев назад

      He's constantly noding it's annoying. If he added even more sounds too; I would be driven insane.

  • @yogibarista2818
    @yogibarista2818 6 месяцев назад +16

    Although they exist, there are very few situations where you would NOT want variable scoping - I changed var to let in all of my legacy code, and I think I can count on one hand the number of times it needed to remain var.

  • @bobmonsour
    @bobmonsour 6 месяцев назад +2

    Thanks, Kevin! This has been an open tab since it came out. Finally watched it. Chris is so very good at these kinds of explanations. This one was very helpful.

  • @chyldstudios
    @chyldstudios 6 месяцев назад +49

    Const should always be the default.

  • @TomasMisura
    @TomasMisura 6 месяцев назад +1

    To be honest, I'm still experimenting with variables like const, var, and let, regardless of the number of courses I've taken and videos I've watched. It seems to me it's somewhat of a trend; I use const or var based on my current mood.

  • @josiaaah_m
    @josiaaah_m 25 дней назад

    One more thing about var compared to const and let is that var DECLARATIONS get hoisted during runtime. The ASSIGNMENT of the variable happens in line though, so if the code declares and assigns a variable at the bottom of the script but is used at the top of the script, the engine will determine that variable as undefined at that point (rather than giving a refereceError if you used const or let). It's similar to how traditional function declarations get hoisted, except with functions the assignment of the function also gets hoisted with the declaration

  • @eksperiment6269
    @eksperiment6269 6 месяцев назад +2

    A small thing that also differs with these, is when a variable is declared in the global scope. If you are using var globally, that variable will attach to the window object, meaning you can access it by window.myVariable. let and const doesn't do this. That means, that should you be in the quite specific scenario of having to access the global variable by string, like this window["myVariable"], it can only be done with var. It is a quite narrow scenario, but I have come across the need of it myself.

    • @kacperkonieczny7333
      @kacperkonieczny7333 6 месяцев назад +1

      and also if you don't use var/let/const to declare it (though then if you're using strict mode it will throw error). It will be like writing window.myVariable

  • @ripwolfe
    @ripwolfe 6 месяцев назад +28

    I always use 'const' by default. I've found over the years that if I feel compelled to use 'let' it's usually an indicator that my code might not be as robust as it could be. I'll never understand the "let" is two letters shorter argument. Any "savings" you gain from typing two fewer characters is swallowed up by host of other work that you need to do as a developer. No one is counting your keystrokes (at least, I hope not).

    • @cmpc724
      @cmpc724 6 месяцев назад +3

      Elon probably is 😂

    • @dankierson
      @dankierson 6 месяцев назад +2

      Lots of situations where a variable is changing value, e.g. the index number of the current slideshow image, strings like page-state , booleans like a cycling indicator on an animatable/off part of a web page.
      There will be a *let* - it must be 🎹

    • @ripwolfe
      @ripwolfe 6 месяцев назад +3

      @@dankierson Take a look at declarative and functional programming paradigms. JS isn't a fully functional lang, but it's close enough that you can refactor a lot of imperative code in ways that greatly reduce the use of 'let'.

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

      @@ripwolfe And we all do, Wolfe. But we can't remove it entirely. Besides, where's the harm in *let* ? It's not *var* we're talking about here. Storm in a cawfee cup for Chrissakes.

    • @jozzetv
      @jozzetv 6 месяцев назад +1

      i also go the always const route. But another way someone could do it, is just use their let and then let the linter decide at the end :D
      If the variable is not changed, let it replace your lets with const.... would also be a solution. But id rather do default const.

  • @danj8404
    @danj8404 6 месяцев назад +4

    I agree with the comments and disagree with the host.
    const unless need to be let.
    and 'var' is just bad
    No thumbs up. A first time for when I watch videos on this channel.

    • @heinzerbrew
      @heinzerbrew 5 месяцев назад

      He's not the host. He's the guest. But you should know that since you have watched the channel before.

  • @kacperkonieczny7333
    @kacperkonieczny7333 6 месяцев назад +1

    My approach:
    Is it a object?
    Yes - const
    No - Can it change at runtime?
    Yes - let
    No - const
    The only place I use var for are closures which are like objects with private properties.
    Also I don't 100% stick to this approach. I sometimes use var for the things declared in the few first lines globally and sometimes I change a variable into a object in those lines without making it a const, which I should not do.

  • @nomadshiba
    @nomadshiba 6 месяцев назад +3

    8:40 especially with ts, or jsdoc comments, its better to use const, because `let`s says value can change and typescript acts like it can change too, making your life harder.

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

    Glad you two got together finally!

  • @lukerazor1
    @lukerazor1 6 месяцев назад +6

    I think const vs let should reflect the intent of the code, do you want it to change or not? Plus if one of my developers tried to commit code that relied on the fuzzy nature of var to work I would tell them to rewrite it so it didn't

    • @montebont
      @montebont 6 месяцев назад +1

      My thoughts exactly...

  • @JosephCodette
    @JosephCodette 6 месяцев назад +1

    A big thing not mentioned is that var can be hoisted from anywhere in the code , which can cause issues , that’s why let is there . Const does not make sense in JavaScript, because it is not really a constant as it would be in other languages . I think of const as a good motivator / indicator to be mindful of where and when you declare a variable.

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

      I'd say the constant part of const is a reference to the pointer of the variable than to the contents of the variable. Ie. If const x = { name: "bob" }, then the pointer reference of that object is stored to x, and a pointer to a separate object (say { name: "sally" }) cannot be set to x.
      However, you can update x.name = "sally", because the pointer of the variable is not changing.
      { name: "sally" } !== { name: "sally" }

  • @itsPenguinBoy
    @itsPenguinBoy 6 месяцев назад +4

    I have never had any training so I found 'var' easy to remember and use it everywhere and rarely had any problems and when I do, I use const. But it's good to have a proper explanation!

  • @feldinho
    @feldinho 6 месяцев назад +8

    To me, const is the default not because it is special, but because let is. I use let to let others know that the value is going to change down the line.

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

    I'm a "lazy developer" too, but that means setting up tools and automations to do boring / repetitive tasks so then I never have to waste time thinking about it. My IDE, ESLint, and Prettier take care of automatically catching and updating let and const declarations.
    Also, you absolutely should worry about variables changing, that's part of building software. And if you don't want to think about it, then defaulting to const makes more sense; if the variable shouldn't be re-assigned, you're good. If the variable should be re-assigned, then your IDE/linting/build-tooling will let you know and you can update it.

  • @CarlosHernandez101400
    @CarlosHernandez101400 6 месяцев назад +1

    I use const when I'm defining html elements with querySelector.
    What I think development comes down to is: programming is a language, and everyone has an accent. Your accent might be a refined English accent (think Patrick Stewart), while someone else might "sound" like Hank Hill. Personally, my accent would be similar to the cross-eyed guy from "The Waterboy."

    • @KevinPowell
      @KevinPowell  6 месяцев назад +1

      I like that analogy! Though no need to be so hard on yourself 😂

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

    I am happy u teach us JavaScript now

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

    One more important aspect regarding var ,let &const is var can approach to global scope results in memory consumption while deallocating after execution

  • @niza.toshpulatov
    @niza.toshpulatov 6 месяцев назад +1

    It would cool to mention that you can achieve array or object immutability using `Object.freeze`. This is especially handy for enums. Just note that freezing is not deep, i.e. it doesn’t protect nested objects.

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

      You can prevent that with good (1d) data structuring ;-)

  • @justingiovanetti
    @justingiovanetti 6 месяцев назад +9

    As per your first example, without var, variables are puts into the global space. Clearly different than using var. var is function scoped.
    Your example just happens to be in a global space.

  • @pandaclouds650
    @pandaclouds650 6 месяцев назад +1

    can you do a tutorial about NPM? i've been searching a npm tutorial but almost are 5yrs ago, and i cant follow it cause its not updated.

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

    Nice intro. Opinionated. But hey...aren't we all ;-)
    Just a few things:
    You _should_ but do not need to declare a variable. That is how 'global' jQuery ($) and Underscore (_) work. In general this is a good approach for global utility libraries.
    Scoping has its uses but so do global variables or functions.
    You can not re-assign a new value to a const. But if it is an object you still can add key-value pairs or modify the value of any key.
    If you do not want that (say for lookup tables with constants) you can 'freeze' the const.
    So: nice helpful intro...thanks for sharing. But IMHO it is slightly more complicated - apart from programming style ;-)

  • @CirTap
    @CirTap 6 месяцев назад +1

    bundlers and transpilers still convert `let` and `const` into `var` and also move the declarations if necessary.

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

      Example? I never noticed this...

  • @deatho0ne587
    @deatho0ne587 6 месяцев назад +1

    Typescript - const arr = [...] as const; none mutable array.

  • @NamVu-im2xm
    @NamVu-im2xm 6 месяцев назад +6

    Seeing var in my old company code gives me anger

  • @Metalvain4
    @Metalvain4 6 месяцев назад +1

    Love these shorter gap closing videos! Keep up the great work, Kevin!

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

      If you're looking for short videos with good examples that deliver a good amount of information, might I recommend Fireship's videos and shorts.

  • @lawrencepsteele
    @lawrencepsteele 6 месяцев назад +2

    Thank you! One of the things about being full stack (hardware-db-middleware-backend-frontend) is you embody "Jack of all trades, master of none." I often wondered why the three declaration types but never took the time to explore. Funny that I find out after I retire.

    • @daveklassen7052
      @daveklassen7052 6 месяцев назад +1

      @@SW-fh7he When I started working with JS, Let was not part of it, in fact I have not used much JS since Let became part of it, since JS is not part of my normal stack these days ... so I can see why someone that is retired now may not have considered it much.

  • @danielgago-sk
    @danielgago-sk 6 месяцев назад

    And the best part is - Programm works even without let, var, or const... 😊
    variable= value;

  • @VirendraBG
    @VirendraBG 6 месяцев назад +1

    Kevin with JS ❤

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

    Thanks Kevin for the video

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

    Kevin we want you teach us JavaScript also . Thank you kavin

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

    Thank you both.

  • @hsvandrew
    @hsvandrew 6 месяцев назад +9

    I was hoping this video would start with “hello my backend friends” 😂

    • @DocGenius42
      @DocGenius42 6 месяцев назад +3

      it's still frontend though

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

      Be careful what you wish for. Kevin will be trying to teach us PHP next.

  • @pamelatrucsas97
    @pamelatrucsas97 6 месяцев назад +1

    And you can declare a var in a function and change its value in another function, right? (which you can"t do with let)

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

    Great video. Thank you!

  • @mudyeet_
    @mudyeet_ 5 месяцев назад +1

    I thought we would talk about hoisting here :(

  • @benzflynn
    @benzflynn 6 месяцев назад +3

    Leave JavaScript to others, Kevin, if this is your goto guy.
    It's nuts to use *let* unless its flexibility is needed: never give a system more entropy than it needs.
    Makes far more sense to use *const* for all Object types in JS, this includes collections of any type, primitive or Object.
    And for primitive types ask yourself if this thing is ever going to change . . . if so, use *let* and otherwise use old *const* again.
    To hell with *var*

  • @germantoenglish898
    @germantoenglish898 6 месяцев назад +4

    I ❤const

  • @Andris_Briedis
    @Andris_Briedis 6 месяцев назад +1

    The missing info is that "var" was the only variable type for a long time and now it is practically left in JS only for compatibility with the older code. Not for use in new codes.

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

      Good point...Var comes from the days of Windows XP...

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

      @@montebont "var" comes long before WinXP.
      G: "JS type "var" since when"

  • @ClarkeDesign
    @ClarkeDesign 6 месяцев назад +2

    I use IntelliJ for all my coding, and it always likes to replace var with let or const. Is there anytime where var would still be useful?

    • @KevinPowell
      @KevinPowell  6 месяцев назад +3

      Generally, no. The actual use cases are so niche, I wouldn't even worry about them

    • @kacperkonieczny7333
      @kacperkonieczny7333 6 месяцев назад +1

      Only thing that var is useful for are closures and they can be mimicked with a objest created from a class that has private properties. So most of the time you don't need it

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

      @@kacperkonieczny7333 Please elaborate as I use closures a lot and never saw any need or advantage for a *var* there.

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

    In that example with wixard and item... Let also shouldnt work becauae item is already defined?? You cant access the inner one once it ends but inside the inner one you can definitely access the outer one...

  • @lougarcia36
    @lougarcia36 6 месяцев назад +15

    I'm not entirely sure why it is hard to use "const" most of the time and use "let" when you need it. I just don't get it.

    • @kacperkonieczny7333
      @kacperkonieczny7333 6 месяцев назад +1

      I guess muscle memory and not planning out what certainly won't change at runtime and what can, which is bad cause you as a programmer should have at least a rough idea of it

    • @heinzerbrew
      @heinzerbrew 5 месяцев назад

      RSI, those two extra letters will destroy your wrists.

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

    Javascript finally!

  • @awkward_coder
    @awkward_coder 4 месяца назад

    Thanks!

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

    I’m using const since some time now. Even for defining functions. To me it makes the behavior much more predictable!

  • @ultratacoRX7
    @ultratacoRX7 4 месяца назад

    i'm old and grumpy and still use var for everything.

  • @rafa6536
    @rafa6536 6 месяцев назад +1

    thanks nerds :)

  • @Flexximilian
    @Flexximilian 5 месяцев назад

    It's mind boggling to me how so many people, _especially_ tutors, present const as being "strange" or "incomplete" because it does not change the inner behavior of a class, object or function (in particular mutability of inner state). It would be _weird_ if it did. The only explanation I have for this is that such folk have never understood values vs. references in the first place, and consequently have no idea of basic OOP concepts. Or they _do_ understand the difference between values and references, but whine about _having to_, or to have to teach it.
    Imagine there was no way to do the opposite, if you'd have to use "let" or "mutable" to be able to manipulate an array once you assigned it. Imagine a buffer would either be externally mutable _and_ reassignable or unmutable and non-reassignable. LOL. But that is what folks that find the meaning of const "strange" or "incomplete" imply would be "more correct" or "complete".
    So please! Just stop even suggesting to beginners that the const behaviour is -- in any way -- strange or incomplete or weird or odd. In fact teach them how and why it is _not_!

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

    I'm all for being a lazy developer, but using 'let' instead of 'const' because it's easier to type is a wild take. Probably the canary in the coalmine of generally not great code.

  • @TheMetalMag
    @TheMetalMag 5 месяцев назад

    the issue is every teachers don't tell you the same thing; they say don't use Var cos it's for Java! then you see videos on utube with people using Var everywhere...then others will use const everywhere..so once again this is confusing and seeing Kevin noding like he understood everything makes me wonder, what will he use if he writes javascript?!

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

    thanks for this. I've wondered this for a long time.

  • @justdude2599
    @justdude2599 6 месяцев назад +1

    last thing i expeceted to see on this channel lol

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

    The problem with 'let' as the default is that I as the user, can now also change the value. Which means if you have forgotten to validate everything on the backend before it goes into the database, the user wins.
    I am in the 'const as default' camp.
    Also, don't think of it as 'changing the variable' think of it as 'overriding the existing value of the variable with a new value'.
    Let lets you override or replace the existing value with a new one, const does not. Once you think like that, it becomes obvious why arrays work with const.
    Also note that Javascript isn't the only one that lets you manipulate a const array, other languages allow it too, so Javascript in this instance is just following the norm.
    One of the few languages that won't let you define an array as a const is 'C#', you have to define it as readonly there.

  • @pendaco
    @pendaco 6 месяцев назад +2

    The biggest crime here is not 'var' but using light mode in his editor 😮

  • @sergioalcantar3290
    @sergioalcantar3290 2 месяца назад

    is item a variable within the var variable... lost...

  • @amekudzilab
    @amekudzilab 6 месяцев назад +1

    Love this

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

    Well we need two more; int and float

  • @StarsManny
    @StarsManny 5 дней назад

    A constant isn't a variable

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

    You should bother to think about whether your variable will change.

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

    var reading this comment section be like: "Time to go rogue" 🤨🤨

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

    12 minutes?
    Tl;dw
    Don't use var
    If it can change use let
    If it can't change use const

  • @vibalciunas
    @vibalciunas 6 месяцев назад +2

    Lots of talk and not a word about performance. When 'var' is converted to bytecode, the scope check procedure call is skipped, so it's faster than 'let' or 'const'.

    •  6 месяцев назад +1

      "Worry about the performance of your code when and if your code has a performance problem."
      The difference is neglibile in the vast majority of cases.

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

      It also helps memory management...

  • @Arunnn241
    @Arunnn241 6 месяцев назад +5

    As someone who dabbles in web dev, I find this video to be lazy content. Sure, the title basically attracts beginner developers but there's nothing here in 12 min that isn't in a 60 second Fireship video. There's not a lot of value in the explanation or examples either. The basic yet incredibly key piece of information that the guy does not state explicitly is that `const` does not allow *"reassignments"* which is a really important concept in computer science and more specifically memory management and leads nicely into an explanation on why `const` was introduced when `let` had already existed, why it's actually not strange pushing to a const declared list and why one might want to use `const` instead of `let`.

  • @AhmadNasriya
    @AhmadNasriya 6 месяцев назад +1

    const should always be used unless absolutely necessary to use let.
    It's much safer that way. If a developer who works for me told me he uses "let" instead of "const" because of the excuses you've just given, I'd fire him immediately.
    Your guest is not the sharpest, Kevin, and a terrible choice to invite. You should not have published this video.

  • @florentd.5817
    @florentd.5817 6 месяцев назад

    There are betters channels to learn and understand Javascript (same for css).

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

    use var wizard, not var item stupid mistake

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

    Make a video on responsive design

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

    I unsub'ed from Chris' newsletter after a few emails where he started talking politics. Keep that toxic sh*t out bro.

  • @115switch
    @115switch 6 месяцев назад +1

    let as the deafult ? Smh
    Someone call the FBI

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

    real men only use var