What is the difference between 'var', 'const' and 'let'?

JavaScript
1

Hi! I am a beginner in JavaScript. Can anyone explain what is the difference between ‘var’, ‘const’ and ‘let’ when initializing variables?
A simple idea is just enough :blush:

1 Like
2

Hey @isuru.sathsara97. Welcome to FCC Forums!

  • A var is function scoped. If it is declared inside a function, then it can only be used inside that function. If it is outside, it has global scope. A var's value can be changed anywhere in the code.
  • let and const are block scoped. These were introduced as alternatives to var.
  • A const's value cannot be changed within the code later.

Check out this link to for more info:
https://codeburst.io/difference-between-var-let-and-const-in-javascript-fbce2fba7b4

1 Like
3

Thank you very much! @paulsonstech :+1:

1 Like
4

Also, it has to do with hoisting. Variables declared with var are initialized at the beginning of the function (initialized, not necessarily defined). const and let are not.

It used to be that we could initialize a variable anywhere in a function body, and it was known by the function, even if it was referenced before it was initialized. Led to sloppy code. Now, you can’t refer to a const or let before you initialize it, which makes for a better discipline.

3 Likes
5

Oops! Forgot that @snowmonkey! Thanks for reminding! I think the link I gave to @isuru.sathsara97 covers it.

1 Like
6

let and const -es6 newest version of JavaScript

2 Likes
7

No, it cannot be reassigned a new value within the same block, which is not the same thing. This might seem like nitpicking, but if you say it’s a constant, OP will get extremely confused when they see code using const where the value clearly seems to change.

If the value is a primitive, it’s immutable. As the variable can’t be reassigned, it is effectively constant in that case. If the value is not a primitive (ie an object of some kind), the reference can’t be reassigned, but the values referenced are completely changeable.

2 Likes
8

So, are you saying that a const outside a block can be changed by changing its value inside the block? I don’t understand it. Anyway, I removed the word constant from my post. Thanks!

1 Like
9

No:

const obj = { foo: 1, bar: 2 };
const arr = [1,2,3,4];

// Sometime later
xs.push(10)
xs.length = 1
delete obj.foo
obj.bar = 5

It means the reference is read-only, that’s all. The values referenced can be altered, and this tends to be very confusing for people learning the language, as constant implies it cannot change.

1 Like
10

Ok. Now I understand. Feel free to edit my post above. Thanks!

11

we never edit posts to correct info :slight_smile:

2 Likes
12

To truly pick nits… A variable in javascript doesn’t “contain” a value. It points to a memory location, which cannot be changed. If that memory location was assigned a string or a number or other primitive, then as long any variable is pointing to that memory location, the string remains the same.

The same thing happens with non-primitive values. If we connect a variable to a memory location that indicates a particular object container, then the object container itself is fixed. It’s contents may change, but the initial object definition, the container, is immutable.

If we mutate a string, what we are doing is stuffing that mutation into a new memory location and pointing our variable to that. If we alter object properties, the container itself is still the same - but internally, it’s pointers have been shifted.

Now, when we declare a variable to be a const, we are telling javascript “hey, this variable? Yeah, it can’t point to another memory location. Ever.” var and let can be reassigned to new memory locations at any time and, if the one they left has nothing pointing to it, the old memory location becomes available again (this is referred to as “garbage collection”). With a const, that value will never be garbage collected, as it’s hard-wired to it’s variable.

With a const, we can do this:

const me = {
  first: "Toby",
  nickname: "Snowmonkey"
};
// the variable points to the {}, not the contents!
// so we can
me.last = "Parent";

// but, as the const it's wired to this {} we can't
me = {
  name: "Bob"
}

We can’t do that last, because the object literal is placed in a different memory location, and our const is locked to the original object literal.

We can alter internal values, because inside the object, memory pointers aren’t fixed by default. They CAN be, but we have to specify we want them frozen.

2 Likes
13

One easy trick to make things simpler: forget var even exists. Focus on the difference between let and const. The only difference between them is that with a let, you can reassign it (let x = 5; x = 10; x = x + y; and so on). With const, you assign it when you declare it and can’t assign it again.

use const wherever you can. And again, forget var exists, it’s just a more confusing variety of let.

5 Likes
14

Thank you @chuckadams :+1:

15

What illustration could be better? Posts before me have given a good illustration.
But in addition,
var leads to hoisting, const makes a declared variable constant.
let however, allows a declared variable to be re-assigned.

let and const were later introduced to avoid the bad practices that come with var.

Recently, it has been argued that let even allows for better performance than const. Reference https://github.com/evanw/esbuild/issues/478

Cheers to you on your Journey!

1 Like
16

That GitHub issue is talking about a performance inpact using let/const over var specifically in Safari. It is not suggesting that let is faster than const. The Javascript core team is working on the issue, and I don’t see it as any sort of justification for using var. Don’t use var.

1 Like