JavaScript Variables

---

JavaScript Variables are used to store values, such as numbers, strings, or objects, that can be used throughout a program.

To create a variable in JavaScript, we use the “var”, “let”, or “const” keyword, followed by the name of the variable, an assignment operator, and the value you want to assign to the variable.

Example

var x = 5;
let y = "Hello";
const z = true;

In an above example, we have created three variables: “x” (var), “y” (let), and “z” (const). “x” is assigned the value 5, “y” is assigned the string “Hello”, and “z” is assigned the boolean value true.

Now, the question will arise. What is the difference between var, let and const.

The main difference between the “var”, “let”, and “const” keywords is how they define the variable’s scope and mutability.

• var creates a variable with Global-scope, means it can be accessed anywhere in the program.
• let creates a block-scoped variable, means it can only be accessed within the block it is defined in (e.g. inside a loop or if statement).
• const also creates a block-scoped variable, but it cannot be reassigned once it has been initialized.

Learn more about “var” “let” and “const”.

Here’s an example to illustrate the difference between “var” and “let”.

Example

<script>
function example() {
var x = 1;
  if (true) {
    var x = 2; // This redefines the outer "x" variable
    document.write(x + "<br>"); // outputs: 2
  }
  document.write(x + "<br>"); // outputs: 2
}
example();

function example2() {
  let y = 1;
  if (true) {
    let y = 2; // This creates a new "y" variable within the block
    document.write(y + "<br>"); // outputs: 2
  }
  document.write(y); // 1
}
example2();
</script>

Code Explanation

In the first example, the outer “x” variable is redefined inside the if block, so both document.write calls output 2. In the second example, the inner “y” variable is a separate variable from the outer “y”, so the first document.write call outputs 2 and the second document.write call outputs 1.

Rules for JavaScript Variable Names

In JavaScript, variable names must follow certain rules to be valid. Here are the rules for JavaScript variable names:

• Variable names must begin with a letter, an underscore (_), or a dollar sign ($). They cannot begin with a number.
• After the first character, variable names can contain letters, numbers, underscores, or dollar signs.
• Variable names are case sensitive, so myVariable and myvariable are two different variables.
• Variable names should be descriptive and meaningful. Avoid using names that are too short or too general, such as “x” or “data”.
• You cannot use reserved JavaScript keywords as variable names, such as “if”, “else”, “function”, “while”, “for”, “true”, “false”, “null”, “undefined”, “this”, “new”, “switch”, “case”, “break”, “continue”, “default”, “try”, “catch”, “finally”, “throw”, “with”, “delete”, “typeof”, “instanceof”, and “in”.
• Variable names should not contain spaces. If you need to use multiple words in a variable name, you can use camelCase or snake_case. For example: myVariable or my_variable.
• Finally, it is good practice to use meaningful names that accurately describe the purpose or content of the variable, as this can make your code more readable and easier to understand.

JavaScript Variables Declaration and Assignment

Most of the beginners get confused about declaring a variable and assign it’s value. While many newbie developers think both are same. In JavaScript, variables can be declared using the var, let, or const keyword, followed by the variable name. You can also assign a value to the variable during declaration or at a later point in the program.

Example

var a; // Declaration
a = 10; // Assignment
var b = 20; // Declaration and Assignment
let c = 25; // Declaration and Assignment
const d = 30; // Declaration and Assignment

Re-Declaring JavaScript Variables

When we re-declare the JavaScript variable with var, it will not lose it’s value.

Example

<script>
var name = "john";
document.write(name);  // Outputs John
var name;
document.write(name);  // Outputs John
</script>

Once we assign the variable with different value, we will get a different output.

Example

<script>
var name = "john";
document.write(name);  // Outputs John
var name = "David";
document.write(name);  // Outputs David
</script>

NOTE:- If you try to re-declare variable with let or const. You will get an error.

---