-1

Might be a kind of easy question, but I have a question on the issue of having the same name for a variable and a function.

If there's a variable,

var add = 1;

and a function,

function add(x,y) {return x+y;}

and there're two console.log,

console.log(add)
console.log(add(1,2))

I've expected those 2 console.log would work properly since add contains the Number and add() is classified as a Function, but the second one prints an error. So they aren't considered the same.

But the result says I'm wrong. Can anyone explain what's going on in my code?

moon
  • 640
  • 6
  • 14
  • 1
    The pointer is the same, so the first is overwritten by the latter. – Marco de Zeeuw Aug 19 '17 at 07:43
  • @MarcodeZeeuw no, the "name" `add` is declared first, then the function is automatically assigned to it *(because function definition, not expression)*, then the `add=1` part of the variable-definition is executed and overwrites `add`. The important thing here is, that the part where you assign a value to a variable is not hoisted, unlike the variable declarations and the function definition. – Thomas Aug 19 '17 at 08:29
  • @Thomas Okay, I got your whole point but the one thing, thanks though. If the part of your explanation 'the part where you assign a value to a variable is not hoisted, unlike ~' is right, then where does that fact that I assigned a value to a variable go? It just will floated on a memory and will be waiting for the garbage collector? – moon Aug 19 '17 at 10:51
  • @moon it will stay where it was. `var a=1, b=2, c=3, d=4; function d(){...}` becomes *something like* `/* hoisted variable declarations and function: */ var a,b,c; function d(){...} /* function body / assigning values: */ a=1, b=2, c=3, d=4;` and now `d=4` has overwritten `function d(){ ... }` as there can be only one thing named `d` *(locally in this execution context, at a time)*. – Thomas Aug 20 '17 at 00:05
  • @Thomas Thanks buddy, I've read your comment for me and other posts and had a kind of deep thought about hoisting in JavaScript and I think I finally figured this out! But thanks for your effort to explain to me :) – moon Aug 21 '17 at 16:23

1 Answers1

4

Variables and function definitions(not expressions) are hoisted to up, it means that wherever in scope you wrote your function or variable they will be moved to the start of the scope. First goes functions definitions then variables. So it means that functions will be overwritten by variables.

var add = 1;
function add(x,y) {return x+y;}

console.log(add);

The order doesn't matter. Later will be the variable and will overwrite

function add(x,y) {return x+y;}
var add = 1;   

console.log(add);
Suren Srapyan
  • 66,568
  • 14
  • 114
  • 112
  • So the function definition has higher priority than the variable's? Is that why you said the order doesn't really matter when they go up to the top of the scope? – moon Aug 19 '17 at 07:59
  • @moon. First will go function definition, then variables. This means that the later will overwrite the sooner. So function definition's name will be overwritten by the variable. Generally with the name you will have variable, not function – Suren Srapyan Aug 19 '17 at 08:01
  • @moon, not necessarily, but `var add = 1` is two things at the same time. It declares a variable and assigns it a value. The declaration is hoisted, the assignment is not. That's why it overwrites the function. If you write only `var add;`, without assigning a value, `add` will contain the function. – Thomas Aug 19 '17 at 08:20