# Hoisting in JS and code snippet comparison

**URL:** <https://forum.freecodecamp.org/t/hoisting-in-js-and-code-snippet-comparison/154110>\
**Category:** General\
**Created:** [October 20, 2017, 5:04am UTC](https://forum.freecodecamp.org/t/hoisting-in-js-and-code-snippet-comparison/154110 "2017-10-20T05:04:53Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![zhouxiang19910319](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/zhouxiang19910319/32/98849_2.png) [@zhouxiang19910319](https://forum.freecodecamp.org/u/zhouxiang19910319)\
**Post date:** [October 20, 2017, 5:04am UTC](https://forum.freecodecamp.org/t/hoisting-in-js-and-code-snippet-comparison/154110/1 "2017-10-20T05:04:53Z")

</div>

Here are 3 code snippet I came up with. Point out which part I got it wrong/right.

```auto
function foo(){
	var a=1;
	console.log(a);
}
var a=2;
function bar(){
	var a=3;
	console.log(a);
}
foo();
bar();
console.log(a);

```

Snippet above will give you 1 3 2 as output. Because they execute according to the function declaration and last one is a global variable `a`;

```auto
function foo(){
	var a=1;
	console.log(a);
}
var a=2;
function bar(){
	var a=3;
}
foo();
bar();
console.log(a);

```

Code above will give you 1 2 as output cos we did not ask `function bar()` to display us anything.

```auto
function foo(){
	var a=1;
	console.log(a);
}
var a=2;
function bar(){
	a=3;
}
foo();
bar();
console.log(a);

```

Then why does this snippet give you the result of 1 3?

Here is what happened as I understand : (because function declaration get hoisted 1st)

```auto
function foo(){
	var a=1;
	console.log(a);
}
function bar(){
	a=3;
}
var a=2;

foo();
bar();
console.log(a);

```

But why the value of a is 3 at the end? What happened?

---

<div class="post-metadata">

**Author:** ![camperextraordinaire](https://avatars.discourse-cdn.com/v4/letter/c/5f9b8f/32.png) [@camperextraordinaire](https://forum.freecodecamp.org/u/camperextraordinaire)\
**Post date:** [October 20, 2017, 5:58am UTC](https://forum.freecodecamp.org/t/hoisting-in-js-and-code-snippet-comparison/154110/2 "2017-10-20T05:58:26Z")

</div>

In the last example, the var a = 2; declared an a variable globally. Inside the bar function, you assign a the value of 3. Since there is no local declaration of a inside bar, JS looks at the next level up (global scope) and finds a variable a there and then assigns it the value of 3. That is why 3 is printed at the end.

---

<div class="post-metadata">

**Author:** ![zhouxiang19910319](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/zhouxiang19910319/32/98849_2.png) [@zhouxiang19910319](https://forum.freecodecamp.org/u/zhouxiang19910319)\
**Post date:** [October 20, 2017, 6:16am UTC](https://forum.freecodecamp.org/t/hoisting-in-js-and-code-snippet-comparison/154110/3 "2017-10-20T06:16:43Z")

</div>

Thanks!!! 😀

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [January 17, 2021, 8:37pm UTC](https://forum.freecodecamp.org/t/hoisting-in-js-and-code-snippet-comparison/154110/4 "2021-01-17T20:37:04Z")

</div>

Closed on January 17, 2021, 8:37pm UTC