Variable Scope - why Lilah, George and Lilah?

This concept is crucial to coding with JavaScript, so it's worth spending some extra time on. Let's take another look at what's happening.

// ---- Global Scope ----
var person = 'George';
// ----------------------

// ---- Function Scope ----
function greeting() {
  var person = 'Lilah';
  console.log(person)
}
// ------------------------

greeting(); // creates new var person in function scope, prints 'Lilah';
console.log(person); // reads person in global scope, HAS NO ACCESS to 'Lilah'
greeting(); // once again creates var person in local scope, prints 'Lilah'

First, we declare a global variable person. It has global scope because it's not declared within a function, and is therefore accessible to the whole program.

Next, we write a function greeting() that declares a local variable person and logs it to the console. When we call greeting(), 'Lilah' will be printed to the console.

Okay, we're back in global scope, and we call greeting(). This function creates a new variable person, assigns it to the string 'Lilah', and logs it to the console.

Then, we call console.log(person). This is the crucial thing to understand -- when using person while in global scope, person equals 'George'. We no longer have access to to the local variable person, the one that equals 'Lilah'. The only way to access that variable is to call greeting().

Speaking of which, we call greeting() again. That function once again creates a new variable person, assigns it to the string 'Lilah', and prints it to the console. Thus we get 'Lilah', 'George', 'Lilah'.

Don't feel bad if you still don't get it, it's a complex topic and takes a while to fully understand. Try reading this, too, it's got some great examples.

Hope this helps!