Confusion in processing of javascript code

Question

Code

function hi() {
    myvar = 'local variable';
}
console.log(myvar);

Output: ReferenceError: myvar is not defined

According to my understanding, javascript goes line by line, examines the variables and their scope. Keeping that in mind shouldn't the following print 'undefined', as myvar exists in global scope?

Answer 1

No it shouldn't, for it to print undefined you need to first define it in a global scope.

The fact that you are assigning some value to that variable inside of a function doesn't mean anything until the function itself is executed.

var myvar;

function hi() {
    myvar = 'local variable';
}
console.log(myvar);

If you omit that var myvar; line and and execute hi function before you do the console.log, you will get "local variable" as a result because that function creates an implicit global binding.

To check this, simply use strict mode and you will get error instead of the result above because strict mode prevents implicit globals.

"use strict";

function hi() {
    myvar = 'local variable';
}

hi();

console.log(myvar);

Answer 2

The problem: myvar throws a ReferenceError

function hi() {
  myvar = 'local variable';
}
console.log(myvar);

I understand you thought you would get undefined.

In the above code myvar hasn't been defined outside the function's scope. So when calling console.log(myvar) it will throw an error. You can ignore the function's declaration for this part, it's as if you had:

console.log(myvar)

---

Solution: set myvar outside of the function's scope

So you need to define your variable before logging it, for example:

var myvar;

function hi() {
  myvar = 'local variable';
}
console.log(myvar);

This will ensure that myvar is defined here

• outside the function's scope: it doesn't have any value so it's undefined

• in the function's scope: it is set to a string

---

More on global variables

As you haven't added the var operator before myvar = 'local variable'; you have essentially accessed the global variable myvar. So by calling hi() you will change the value of myvar outside of the function's scope:

var myvar;

function hi() {
  myvar = 'local variable';
}

console.log(myvar);
hi();
console.log(myvar);

Answer 3

As found in the MDN docs

You can declare a variable in three ways:

• With the keyword var. For example, var x = 42. This syntax can be used to declare both local and global variables.

• By simply assigning it a value. For example, x = 42. If this form is used outside of a function, it declares a global variable. It generates a strict JavaScript warning. You shouldn't use this variant.

• With the keyword let. For example, let y = 13. This syntax can be used to declare a block-scope local variable. See Variable scope below.

Your function will work, because it satisfies method #2, declaring a variable by assigning it a value.

The console.log(myvar) will not work as myvar was never declared through any of the 3 means mentioned above. As such, you get a ReferenceError.

According to my understanding, javascript goes line by line, examines the variables and their scope. Keeping that in mind shouldn't the following print 'undefined', as myvar exists in global scope?

No, the function was not called, and as such the code inside it was not run, and so the variable was never created. If you had myvar = 'local variable'; outside of the function, it will work.

Answer 4

This is because the variable scope is local to the function. try declaring the variable outside first.

var myvar;
function hi() {
  myvar = 'local variable';
}
console.log(myvar);