What is scope in Javascript and how var and let different?

As per my understanding scope means that if a variable declared inside a function it has a local scope and if declared outside function it has a global scope. If i am right then before let var was used to declare a variable so variables declared using var have global scope even if declared inside a function. Does that mean if i declare a variable A = 1 inside a function using var and outside of function if i write document.write(A) then it should output the value 1 right? And if i declare the same using let instead of var inside a function then it should output error of undeclared variable since let correct the global scope problem of var in a function right? If so then why both var and let behave same when i write code in vs code both cause the declared variable inside a function to be recognized outside of function also why? Does i misunderstood the meaning of scope? what var do that let does not? and what let do that var does not?

As per my understanding scope means that if a variable declared inside a function it has a local scope and if declared outside function it has a global scope.

Kind of. Functions can be defined in functions. What you would be essentially true if the function is declared in the global scope.

If i am right then before let var was used to declare a variable…

Yes, before we used var. Now we use let and const.

…so variables declared using var have global scope even if declared inside a function.

No. Variables declared with var have function level scoping. If you declare it in a function, it will have scope only down to that function level.

Does that mean if i declare a variable A = 1 inside a function using var and outside of function if i write document.write(A) then it should output the value 1 right?

No, it would throw and error because that variable is out of scope and is not declared.

And if i declare the same using let instead of var inside a function then it should output error of undeclared variable since let correct the global scope problem of var in a function right?

Declaring a variable with var or let in a simple function would have no effect on scope. The make difference is if they were in a code block, the var variable’s scope would extend outside the code block to the containing function (or global if there is no function) whereas the let variable would only extend to the code block. That is the biggest difference. There are a few other small things, hoisting being the most important - let doesn’t hoist.

what var do that let does not? and what let do that var does not?

var has function level scope but let has block level. var hoists. var will let you redeclare variables. var creates properties on the global object (in top level scope).

Don’t use var. It is messy and allows mistakes. Use let if you need to change/reassign it, const if you don’t. And const follows the same basic rules as let but it must be initialized and it can’t be changed. It’s important to know what var is (you’ll see it in old code), but don’t use it.

function test() {
  var a = 1
  let b = 2
}

// a is not declared here, would throw an error
// b is not declared here, would throw an error

if (true) {
  var c = 3
  let d = 4
  // c is declared here, function level scope
  // d is declared here, block level scope
}

// c is declared here, function level scope
// d is not declared here, would throw an error, because we are outside its block level scope

// e is declared here (hoisted), but not initialized or defined
// f is not declared here, would throw an error, not hoisted

var e = 5
let f = 6

// e is declared and initialized here
// f is declared and initialized here

// window.e is defined as 5
// window.f is undefined

// var e = '5' // no problem
// let f = '6' // throws error, can't redeclare
1 Like

Thank you for answering.