Understanding Variables in JavaScript

In JavaScript, one of the fundamental concepts you will need to learn and understand as a beginner is variables. This important component allows you to store, manipulate, and use data in your JavaScript code. In this article, we will explore what variables are, the declaration of variables, the rules applied when declaring a variable, and naming conventions for variables.

What is a Variable

A variable is the name of a storage location used to store data in JavaScript. You can think of a variable as a container that holds data values. There are two types of variables in JavaScript: local and global.

Variables allow developers to store different values in a code and reuse or manipulate them whenever needed. A variable's values are assigned using the assignment operator("=").

Declaring a Variable

In JavaScript, variables are declared using the keywords: var, let, and const.

1. var: This is the oldest way of declaring a variable in JavaScript. It is now less commonly used in modern code due to its issue with scoping.

Example:

var number = 30;

In the example above, the keyword ‘var’ is used in declaring the variable, "number" is the name assigned to the variable, and '=' is the assignment operator used to designate the value "30" to the variable.

2. let: This is commonly used when declaring a variable in modern code because it is block-scoped. Let is said to be block-scoped because the variables declared in it are only accessible within the code in which it was defined.

   Example:

    let name = 'Ogechi';
   

3. const: This is also block-scoped. When a value is assigned in const, it cannot be altered or changed.

Example:

const country = 'Nigeria';

In the example above, the variable “country” data, “ "Nigeria" can not be changed or added throughout the code.

Rules / Syntaxes Applied when Declaring a Variable

When declaring a variable in JavaScript, there are some syntaxes to follow to avoid errors or complications. It's important to follow these rules:

A variable name must begin with a letter, underscore(_), or dollar sign($). A variable name cannot start with a number.

Example:

let name = 'Rose';   // Correct

let $price = 99.5;  //  Correct

let _score = 10;   //  Correct

let 2name = 'Bright';  // Incorrect

2. JavaScript is case-sensitive. The variable let number = 30; is different from the variable let Number = 30;

3. Avoid using reserved words as a variable name in JavaScript. For example, if, while, let, const, etc.

4. A variable name should be descriptive and avoid using lengthy variable names.

   Example:

    let userAge = 18;  // Descriptive and concise variable name
   

5. Values or data inside a variable declared with let and var can be reassigned but the data inside a variable declared with const cannot be reassigned throughout the code.

Example:

let score = 50;      // Valid
score = 100;

var name = 'Ben';    // Valid
name = 'Henry';

const pi = 3.14;     // Invalid
pi = 3.2;

In JavaScript, you can update the value of the variable in both let and var by writing the name of the variable and assigning a new value to it by using the assignment operator("=") as shown in the example above.

Naming Conventions for Variable

When naming variables in Javascript, developers have three different naming standards, all of which start with a letter.

• Camel Case(camelCase): This is the most common naming standard in Javascript. It involves starting the name of the variable with a lowercase and capitalizing the first letter of the subsequent word.

let userAge = 18;

• Pascal Case(PascalCase): This is similar to the camel naming convention. In Pascal's naming convention, the first letter of all subsequent words is capitalized.

    var UserAge = 18;
  

• Upper with Underscore: This is mostly reserved for constants that are intended to remain unchanged throughout the code.

const USER_AGE = 18;

Conclusion

In summary, understanding variables in JavaScript is essential. A variable serves as a container that stores data or values needed in a code and this data can be changed or manipulated thereby enabling dynamic programming. By understanding the different types of variables, developers can write clearer and more efficient code. As you continue to go in-depth into JavaScript, this fundamental concept will help you solve complex problems and build well-interactive web applications.