Variables in Javascript

What are Variables?

Variables are containers for storing data values in JavaScript.
They act as symbolic names for values, allowing you to use names (identifiers) to represent and manipulate data in your programs.

Declaration and Initialization:

Variables are declared using keywords like var, let, or const.
The var keyword was traditionally used but is now considered outdated. let and const are modern and provide better scoping rules.
let is used for variables that can be reassigned, while const is used for variables that should remain constant.

Declaration

You declare a variable using the var, let, or const keyword, followed by the variable name.

var name;  // using var (older way, not recommended)
let myVariable;  // Declaration
let myNumber = 42;  // Initialization
const pi = 3.14;  // Constant variable

Data Types:

JavaScript is loosely typed, meaning variables can hold values of any data type.
Common data types include:
Number: Integer or floating-point numbers.
String: Sequence of characters (text).
Boolean: Represents true or false.
Array: Ordered list of values.
Object: Collection of key-value pairs.

const name = "John Doe" // String
let age = 34 // Number
let hasPets = true // Boolean
let pets = ["Max", "Jully"] // Array
let tests = { // Object
  math: 10
  geography: 7.5
}

Variable Naming:

Variable names must follow certain rules:
They are case-sensitive (myVar and myvar are different).
They can include letters, digits, underscores, and dollar signs.
The first character cannot be a digit.
Descriptive names are encouraged for clarity.

Assigning and Reassigning:

Variables can be assigned values using the = operator.
let and var allow reassignment, while const does not.

let myVar = 10;
myVar = 20;  // Reassignment allowed for 'let'
const myConst = 30;
// myConst = 40;  // Error: Reassignment not allowed for 'const'

Scope:

Variables have either global or local scope.
Variables declared with var have function scope, while those declared with let and const have block scope.
Block scope means the variable is only accessible within the block (enclosed by curly braces) where it is defined.

Hoisting:

Variables declared with var are hoisted to the top of their scope.
This means you can use a variable before it’s declared, but its value will be undefined.

console.log(myVar);  // undefined
var myVar = 10;

Variables declared with let and const are also hoisted but remain in a "temporal dead zone" until the actual declaration is encountered.

Template Literals:

Template literals, denoted by backticks (`), allow for easy string interpolation and multiline strings.

let name = "John";
let greeting = `Hello, ${name}!`;

Conclusion:

Variables are fundamental to programming in JavaScript, enabling the storage and manipulation of data dynamically and flexibly.

Understanding these aspects of variables will empower you to effectively use them in your JavaScript programs. Whether you’re building simple scripts or complex web applications, a solid grasp of variables is essential.

Command Palette