JavaScript

JavaScript is a high-level, interpreted programming language that is widely used for web development. Initially designed as a client-side scripting language, it runs directly in web browsers, enabling dynamic and interactive user experiences. JavaScript can now be used for server-side development as well.

JavaScript Variables

2 April 2025 | Category:

What is a Variable?

A variable in JavaScript is a container for storing data. It allows you to store, update, and retrieve values in your program.


1️⃣ Declaring Variables in JavaScript

JavaScript provides three ways to declare variables:

KeywordScopeReassignmentHoistingBest Practice
varFunction-scoped✅ Allowed✅ Hoisted but undefined❌ Avoid using (old method)
letBlock-scoped✅ Allowed❌ Not hoisted✅ Preferred for variable values
constBlock-scoped❌ Cannot be changed❌ Not hoisted✅ Preferred for constants

2️⃣ Using var (Old Way – Avoid Using)

🔹 Example:

var name = "Alice";
console.log(name);  // Output: Alice

var age = 25;
age = 30;  // Reassigning value
console.log(age);  // Output: 30

❌ Why Avoid var?

  • var is function-scoped, meaning it can be accessed anywhere inside a function.
  • It can be redeclared, which can lead to errors in large programs.

3️⃣ Using let (Recommended for Variables)

🔹 Example:

let city = "New York";
console.log(city);  // Output: New York

city = "London";  // ✅ Allowed (Reassignment)
console.log(city);  // Output: London

✅ Why Use let?

  • let is block-scoped (only available inside {} where declared).
  • It cannot be redeclared in the same scope, preventing accidental overwrites.

4️⃣ Using const (Recommended for Constants)

🔹 Example:

const PI = 3.14159;
console.log(PI);  // Output: 3.14159

// PI = 3.14; ❌ Error: Cannot reassign a constant

✅ Why Use const?

  • const is block-scoped like let.
  • It cannot be reassigned after initialization.
  • Best for values that never change (e.g., mathematical constants, API URLs).

5️⃣ Variable Naming Rules

🔹 Valid Names:
✔️ Must start with a letter, $, or _
✔️ Can contain letters, numbers, _, and $
✔️ Case-sensitive (myVar and myvar are different)

🔹 Invalid Names:
❌ Cannot start with a number (1name ❌)
❌ Cannot use reserved keywords (e.g., let let = 5; ❌)

🔹 Example:

let firstName = "John";  // ✅ Correct
let $price = 100;  // ✅ Correct
let _totalAmount = 500;  // ✅ Correct

// let 123user = "Alice"; ❌ Invalid (Cannot start with a number)

6️⃣ JavaScript Data Types in Variables

JavaScript variables can store different types of values.

🔹 Example:

let text = "Hello";  // String
let number = 42;  // Number
let isStudent = true;  // Boolean
let fruits = ["Apple", "Banana", "Mango"];  // Array
let person = { name: "John", age: 25 };  // Object
let nothing = null;  // Null
let notDefined;  // Undefined

7️⃣ Variable Scope in JavaScript

Scope defines where the variable can be accessed in your program.

🔹 Global Scope: Variable is accessible everywhere in the script.
🔹 Function Scope: Variable is accessible only inside the function.
🔹 Block Scope: (For let & const) Variable is accessible only inside {}.

🔹 Example:

let globalVar = "I am global";  // Global scope

function testFunction() {
    let localVar = "I am inside a function";  // Function scope
    console.log(localVar);  // ✅ Works
}

console.log(globalVar);  // ✅ Works
// console.log(localVar); ❌ Error: localVar is not defined

8️⃣ Hoisting in JavaScript

Hoisting is JavaScript’s behavior where variables and functions are moved to the top of their scope before execution.

🔹 Example (var is hoisted but undefined):

console.log(x);  // Output: undefined (Hoisting works with `var`)
var x = 10;

🔹 Example (let & const are NOT hoisted):

console.log(y);  // ❌ Error: Cannot access 'y' before initialization
let y = 20;

9️⃣ Best Practices for JavaScript Variables

✅ Use const by default, and let when you need to change values.
✅ Avoid var to prevent unexpected bugs.
✅ Use meaningful names (userAge instead of x).
✅ Follow camelCase naming convention (firstName, totalAmount).


🚀 Conclusion

✔️ var is outdated, avoid using it.
✔️ let is great for variables that change.
✔️ const is best for constants that don’t change.
✔️ Use meaningful names & follow best practices.