Variable Scope: Global & Local
There are two types of Variables within JavaScript programming. It’s important to know the scope of each type of variable, because you need to know when they’ll be available to be called. Global Variables are able to be used throughout your JavaScript programs. Local Variables are only usable within the functions wherein they were called. Local variables always require the “var” keyword, and Global Variables can be declared without a keyword. It’s a “best practice” to always declare your Variables within JavaScript, but, as you’ll see from the example below, you sometimes want to skip the declaration such as when declaring a global variable within a function. Notice that the first Global Variable is declared using the “var” keyword outside of the function. the 2nd Global Variable is declared without the “var” keyword, because it’s being declared inside of the function. In other words, JavaScript always treats it like a Global Variable when a keyword isn’t used when declaring a variable inside of a function because a Local Variable must use the keyword “var”.

var myGlobalVarOne = "<p>My Global Variable 1.</p>";
function variableScopeDemo() {
myGlobalVarTwo = "<p>My Global Variable 2..</p>";
var myLocalVar = "<p>My Local Variable.</p>";
document.write(myGlobalVarOne);
document.write(myGlobalVarTwo);
document.write(myLocalVar);
}
Our function Call & Statements
When we call the function, all of the variables are written to the screen. When we add statements writing the variables to the screen after the statement, we notice that the local variable doesn’t write to the screen. That’s because it’s only available within the function in which it was declared.

variableScopeDemo();
document.write(myGlobalVarOne);
document.write(myGlobalVarTwo);
document.write(myLocalVar);

Results of the Function Call & 3 Statements above:
If all Variables were available to be returned to the scree, there should be six displayed. Since the last statement calls the Local Variable outside of the function, no value is returned.

Duplicate Variable Names
The first Variable Declaration below is Global because we’re declaring it outside of the function. Within the function we’re declaring a Local Variable because the “var” keyword is being used. We’re giving the same name to both the Global and Local Variables. When we make our calls below, what results to you expect?

var sportsCar = "Corvette";
function duplicateVariableNames() {
var sportsCar = "Mustang GT";
document.write("<p>My " + sportsCar + " is the fastest!</p>");
}
Our function Call & Statements
The first Statement is a function call, so we can expect the Local Variable within the function to be displayed to the screen. The second call is going to call the Global Variable because the Global Variable is the only one available outside of the function.

duplicateVariableNames();
document.write("<p>My " + sportsCar + " is the fastest!</p>");

Results of the Function Call & single Statement above:
Voila…just as we expected!