Lesson 4: JavaScript Variables

4.1 What is a Variable in JavaScript?

A variable is something that holds values or information. The values can be numbers (numeric values), text (strings) or some other kinds of information. These values can vary from time to time, that is why the name variable.

Rules for Naming Variables

There are a few rules regarding variable names (unique identifiers) in JavaScript:

• Names can contain letters, digits, underscores, and dollar signs
• Names must begin with a letter
• Names can also begin with $ and _ (but we will not use it in this tutorial)
• Names are case sensitive (y and Y are different variables)
• Reserved words (like JavaScript keywords) cannot be used as names

4.2 Assigning Values to Variables

After you have created a variable, you can assign a value to it. The value can be in the form of a number (numeric value), text (String) or boolean (true or false).

Basic Syntax

var variable_name = value;

Example 4.2(a): Assigning a numeric value

var mark = 20;
var sell_price = 100;
var age = 40;
var height = 180;
var temp = 30;

Example 4.2(b): Assigning a String

var First_Name = "George";
var car_model = "Laser 100";
var Company_Name = 'Ultra Mobile LLC';

Example 4.2(c): Assigning a Boolean value

var paid = true;
var alive = false;
var positive = true;

4.3 Variable Declaration (var, let, const)

JavaScript provides three ways to declare variables: var, let, and const. Each has different characteristics:

var x = 5;

let y = 10;

const PI = 3.14;

Example 4.3: Declaration Differences

// Using var
var count = 5;
count = 10; // This is allowed
var count = 15; // Redeclaration is allowed

// Using let
let total = 100;
total = 200; // Reassignment is allowed
// let total = 300; // Error: redeclaration not allowed

// Using const
const MAX_USERS = 100;
// MAX_USERS = 200; // Error: reassignment not allowed
// const MAX_USERS = 300; // Error: redeclaration not allowed

4.4 Variable Scope

The scope of a variable determines where it can be accessed in your code. JavaScript has three types of scope:

Global Scope

A variable declared outside any function has global scope and can be accessed from anywhere in your code.

var globalVar = "I'm global"; // Global variable

function showGlobal() {
    console.log(globalVar); // Accessible here
}

Function Scope

Variables declared with var inside a function are scoped to that function.

function myFunction() {
    var functionScoped = "I'm function-scoped";
    console.log(functionScoped); // Accessible here
}

// console.log(functionScoped); // Error: not accessible here

Block Scope

Variables declared with let and const are scoped to the block (within curly braces {}) where they are defined.

if (true) {
    let blockScoped = "I'm block-scoped";
    const anotherBlockScoped = "Me too!";
    console.log(blockScoped); // Accessible here
}

// console.log(blockScoped); // Error: not accessible here

4.5 Application

Let's apply what we've learned about variables in the following example:

Example 4.5(a): Book Information

<script>
var Author_Name  = "John Brandon",
    Author_ID    = "A1234",
    ISBN         = "0-7789-0234-6",
    Royalty      = 100000;

document.writeln("Author Name: " + Author_Name + "<BR>");
document.writeln("Author ID: " + Author_ID + "<BR>");
document.writeln("ISBN: " + ISBN + "<BR>");
document.writeln("Royalty Payment: $" + Royalty);
</script>

Interactive Variable Playground

Real-world Applications

Variables are used everywhere in JavaScript programming:

• Storing user input from forms
• Tracking application state
• Calculating values in financial applications
• Controlling program flow with conditionals
• Managing data in complex applications