Introduction to Variables and Data Types: What You Need to Know Beginner to Advance
Table of contents
Variables
A variable is a container used to store data values. In JavaScript, we can declare variables using the keywords var
, let
, or const
.
Declaring Variables:
var
: The old way of declaring variables. It has function scope or global scope and can be redeclared, that’s why it’s not recommended to use.let
: Introduced in ES6. It has block scope and cannot be redeclared.const
: Introduced in ES6. It has block scope and must be initialized at the time of declaration. Its value cannot be reassigned after initialization.
Example:
var name = "John"; // var declaration
let age = 25; // let declaration
const PI = 3.1416; // const declaration (cannot be changed)
Scope of Variables:
Global scope: Variables declared outside any function are in the global scope and accessible throughout the program.
Function scope: Variables declared with
var
inside a function are only accessible within that function.Block scope: Variables declared with
let
orconst
inside a block ({}
) are accessible only inside that block.
Example of scope:
function example() {
var x = 10; // function scoped
if (true) {
let y = 20; // block scoped
const z = 30; // block scoped
}
console.log(x); // accessible
console.log(y); // error (y is block-scoped)
}
Data Types
JavaScript has several built-in data types, which can be classified into two categories: Primitive and Non-Primitive (Reference).
1. Primitive Data Types:
Primitive data types are immutable and are stored by value.
Number: Represents both integers and floating-point numbers.
- Example:
42
,3.14
- Example:
String: Represents a sequence of characters (text).
- Example:
"Hello"
,'World'
- Example:
Boolean: Represents logical values:
true
orfalse
.- Example:
true
,false
- Example:
Null: Represents the intentional absence of a value (an object with no value).
- Example:
null
- Example:
Undefined: Represents a variable that has been declared but not yet assigned a value.
- Example:
undefined
- Example:
Symbol: Represents a unique identifier.
- Example:
let symbol = Symbol('id')
- Example:
BigInt: Represents integers with arbitrary precision (for very large numbers (2^53-1).
- Example:
let bigNumber = 9007199254740991n
- Example:
Example of Primitive Data Types:
let age = 30; // Number
let name = "Alice"; // String
let isStudent = true; // Boolean
let emptyValue = null; // Null
let notAssigned; // Undefined
let id = Symbol('id'); // Symbol
let bigNumber = 12345678901234567890n; // BigInt
2. Non-Primitive (Reference) Data Types:
Non-primitive data types store references to values, rather than actual values.
Object: A collection of key-value pairs (properties).
- Example:
{name: "John", age: 30}
- Example:
Array: A list-like object that stores multiple values.
- Example:
[1, 2, 3]
- Example:
Function: A block of reusable code.
- Example:
function greet() { return 'Hello'; }
- Example:
Example of Reference Data Types:
let person = { name: "John", age: 30 }; // Object
let numbers = [1, 2, 3]; // Array
let greet = function() { return "Hello"; }; // Function
Key Differences Between Primitive and Reference Types:
Aspect | Primitive Types | Reference Types |
Stored By | Stored by value | Stored by reference (points to a location in memory) |
Immutability | Immutable (value cannot be changed directly) | Mutable (can change object properties or array elements) |
Example | number , string , boolean , null , etc. | object , array , function |
Example:
// Primitive Example
let a = 10;
let b = a;
a = 20;
console.log(a); // 20
console.log(b); // 10 (since primitives are stored by value)
// Reference Example
let obj1 = { name: 'John' };
let obj2 = obj1;
obj1.name = 'Alice';
console.log(obj1.name); // Alice
console.log(obj2.name); // Alice (since objects are stored by reference)
Summary:
Variables in JavaScript can be declared using
var
,let
, orconst
.JavaScript has two types of data types: Primitive (e.g.,
number
,string
,boolean
) and Reference (e.g.,object
,array
,function
).Primitive types are immutable and stored by value, while reference types are mutable and stored by reference.
The typeof
operator in JavaScript is used to determine the type of a given operand. It returns a string that indicates the type of the operand.
Syntax:
typeof operand
Example:
// Primitive
let str = "Hello World";
console.log(typeof str); // "string"
let isTrue = true;
console.log(typeof isTrue); // "boolean"
let **notDefined**;
console.log(typeof notDefined); // "undefined"
let emptyValue = null;
console.log(typeof emptyValue); // "object" (this is a known quirk in JavaScript)
let symbol = Symbol("id");
console.log(typeof symbol); // "symbol"
let bigNumber = 12345678901234567890n;
console.log(typeof bigNumber); // "bigint"
// Non-primitive
let obj = { name: "John" };
console.log(typeof obj); // "object"
let arr = [1, 2, 3];
console.log(typeof arr); // "object"
function greet() { return "Hello"; }
console.log(typeof greet); // "function"
The typeof
operator in JavaScript is used to determine the type of a given operand. It returns a string that indicates the type of the operand.
Summary of Return Values of typeof
:
Value | Result of typeof |
Number | "number" |
String | "string" |
Boolean | "boolean" |
Undefined | "undefined" |
Null | "object" (quirk) |
Object | "object" |
Array | "object" |
Function | "function" |
Symbol | "symbol" |
BigInt | "bigint" |
Summary
Variables in JavaScript can be declared using
var
,let
, orconst
.JavaScript has two types of data types: Primitive (e.g.,
number
,string
,boolean
) and Reference (e.g.,object
,array
,function
).Primitive types are immutable and stored by value, while reference types are mutable and stored by reference.
These changes should make your article more comprehensive and reader-friendly.