Variables & Identifiers

This guide explains how to name variables (identifiers) in JavaScript and provides a deep dive into the three keywords used to declare them: var, let, and const.

1. Identifiers (Naming Rules)

An identifier is simply the name you give to a variable, function, or object. JavaScript has strict rules and conventions for these names.

Strict Rules (Must Follow)

• Start properly: Must begin with a letter (a-z, A-Z), underscore (_), or dollar sign ($). Cannot start with a number.

• Allowed characters: After the first character, you can use letters, numbers, underscores, or dollar signs.

• Case sensitivity: myVar and myvar are two completely different variables.

• No keywords: You cannot use reserved words like if, for, class, return, or let as names.

Naming Conventions (Best Practices)

• camelCase: The standard for variables and functions. Start lowercase, and capitalize every subsequent word.

  • Good: userName, totalPrice, isLoggedIn

  • Bad: User_Name, total-price

• Descriptive: Names should describe the value.

  • Good: taxRate

  • Bad: x, data, thing

2. Variable Declaration Keywords

Modern JavaScript (ES6+) offers three ways to create variables. Choosing the right one is crucial for code stability.

A. const (Constant)

This is the default choice for modern development. It creates a reference that cannot be changed.

• Scope: Block Scoped (only exists inside the {} it was created in).

• Reassignment: Not allowed. You cannot use the = operator on it again.

• Initialization: Must be assigned a value immediately when declared.

Crucial Note on Objects/Arrays:

const prevents reassignment of the variable identifier, but it does not make the content immutable.

const user = { name: "Alice" };
user.name = "Bob"; // This works! (Mutation is allowed)
user = { name: "Charlie" }; // Error! (Reassignment is forbidden)

B. let

Use let only when you know the value needs to change later, such as in loops or counters.

• Scope: Block Scoped (only exists inside the {} it was created in).

• Reassignment: Allowed.

• Redeclaration: You cannot declare the same variable name twice in the same block.

let score = 0;
score = 10; // Allowed
let score = 20; // Error! 'score' has already been declared

C. var (Legacy)

This is the original way to declare variables. It is generally avoided in modern code due to confusing behavior.

• Scope: Function Scoped (or Global). It ignores block scopes like if or for.

• Hoisting: var variables are moved to the top of their scope during execution but initialized as undefined. This can lead to silent bugs where code runs but uses "undefined" values.

• Redeclaration: You can declare the same var multiple times without error, which often overwrites data accidentally.

3. When to Use Which?

Follow this simple hierarchy for cleaner, bug-free code:

1. Default to const:

   Always start by using const. Most variables (imported modules, configurations, fixed values, object references) never actually need to be reassigned. This prevents accidental changes.

2. Use let only if necessary:

   If you are writing a for loop, or if you have a specific variable (like a counter or a toggle switch) that must change value, switch it to let.

3. Avoid var:

   There is almost no reason to use var in modern JavaScript development (ES6+). Its scoping rules are unintuitive and prone to bugs.