3

I tried to explain the problem with the javascript hoisting, but I couldn't explain the case of b.

Didn't b = 50 modify the global variable b?

Is it the reason for block-level scopes?

Environment

Chrome 77

{
  a = 50
  function a() {}
}
console.log(a) //  50
console.log(b) // undefined
{
  console.log(b) // f b () {}
  function b() {}
  b = 50
  console.log(b) // 50
}
console.log(b) // ƒ b () {}

I thought b was 50 like a. but it was a function.

31piy
  • 23,323
  • 6
  • 47
  • 67
Annani Zhu
  • 33
  • 4
  • the placement of `{}` is important to .. console.log(b) inside the `{}` is different to outside - not that this information helps! – Jaromanda X Sep 30 '19 at 02:42
  • `console.log(b)` inside the {} is normal. It's `f b() {} ` before `function b () {}`, It's 50 after `b = 50` – Annani Zhu Sep 30 '19 at 03:12
  • The behavior is inconsistent. If you run this in Safari, you will get different result. Chrome and Firefox seem to produce the same results though. – 31piy Oct 03 '19 at 11:02

1 Answers1

1

2 important things are happening here

  1. Hosting happens in a function - placing anything inside {} considered as a block, not a function.
  2. Function declarations are hoisted over variable - hence if var and function have the same name, function will get preference

console.log(x); // f() {} //hoisted with assignment since "x" is function
var x = 90;
function x() {}

console.log(a); // undefined // hoisting of child block-scope variable is never assigned not even if "a" is function
{
    console.log(a); // f(){}
    a = 50; //**while execution //since global scope "a" not assigned yet it takes the first assignment in this child-block
    console.log(a); // 50 // because value has been assigned to "a" already
    function a(){} // Ignored //function "a" was never hoisted over variable assignment
    console.log(a); // 50 // block scope has "a=50" attached to it
}
console.log(a); // 50 // global scope also has "a=50" attached to it


console.log(b) // undefined // hoisting of child block-scope variable is never assigned not even if "a" is function
{
  console.log(b) // f () {}
  function b() {} // While hoisting global scope and this block scope get "b" attached to their scope as a function
  b = 50 // var b is reassigned, but "b" attached to this block is only reassigned, since type is changed globally attached "b" is not reached
  console.log(b) // 50
}
console.log(b) // ƒ () {} // globally attached "b" is a function
HugeBelieve
  • 304
  • 1
  • 7
  • `b = 50` Is the `b` local variable ？why not a global variable? – Annani Zhu Sep 30 '19 at 10:12
  • Well firstly don't just think local and global, think how a variable is accessable in a block of code, i.e., that variable get attached to the scope of that block of code, e.g. how closure get attached to a function. Similarly there the global block has a variable "b" attached to it as well as the block {} will also have a "b" variable attached to its scope. So it is not necessary that both of these block have a same variable values attached to their scope – HugeBelieve Sep 30 '19 at 10:18