JavaScript Data Types

Understanding Data Types in JavaScript

JavaScript is also dynamically typed, which means you don't need to explicitly declare the type of a variable. The JavaScript engine automatically determines the data type based on the value assigned to the variable.

For example, if you assign a number to a variable, JavaScript will recognize it as a number type. Similarly, if you assign a string (text wrapped in quotes), JavaScript will treat it as a string. This flexibility makes JavaScript easy to work with, but also requires careful handling to avoid type-related errors.

2. String (string)

A string in JavaScript represents a sequence of characters enclosed within single quotes (' '), double quotes (" "), or backticks (` `) for template literals. Strings are used to store and manipulate textual data. You can perform various string operations like concatenation, length calculation, and more.

// Example of a string
let greeting = "Hello, world!";
let name = "Tom";
console.log(greeting + " " + name);

// Example of a string
let greeting = "Hello, world!";
let name = "Tom";
console.log(greeting + " " + name);

How It Works:

• greeting: This variable stores the string value "Hello, world!".
• name: This variable stores the string value "Tom".
• greeting + " " + name: This expression concatenates the two strings greeting and name with a space in between, producing the result "Hello, world! Tom".
• When the code runs, JavaScript outputs the concatenated string, "Hello, world! Tom", in the console.
• The console.log() function displays the result in the console.

Output:

Hello, world! Tom

Hello, world! Tom

3. Boolean (boolean)

A Boolean in JavaScript represents a logical value, which can either be true or false. It is often used in conditional statements to control the flow of code based on certain conditions.

// Example of a boolean
let isActive = true;
let isComplete = false;

console.log(isActive);  // Outputs: true
console.log(isComplete);  // Outputs: false

// Example of a boolean
let isActive = true;
let isComplete = false;

console.log(isActive);  // Outputs: true
console.log(isComplete);  // Outputs: false

How It Works:

• isActive: This variable stores the boolean value true, indicating that something is active or true.
• isComplete: This variable stores the boolean value false, indicating that something is not complete or false.
• When the code runs, JavaScript outputs the boolean values true and false to the console.
• The console.log() function is used to display the values of isActive and isComplete.

Output:

true false

true false

4. Undefined (undefined)

In JavaScript, a variable that has been declared but has not yet been assigned a value is of type undefined. This is the default value assigned to uninitialized variables. It signifies the absence of an assigned value but not the absence of the variable itself.

// Example of undefined
let score;
console.log(score);

// Example of undefined
let score;
console.log(score);

How It Works:

• score: This variable is declared but not assigned any value.
• Since there is no assigned value, JavaScript automatically gives it the type undefined.
• When you log score to the console, it shows undefined.

Output:

undefined

undefined

5. Null (null)

In JavaScript, null represents an intentional absence of any object value. Unlike undefined, which indicates a variable has been declared but not yet assigned a value, null is explicitly assigned to a variable as a representation of "no value."

// Example of null
let user = null;
console.log(user);

// Example of null
let user = null;
console.log(user);

How It Works:

• user: This variable is explicitly assigned the value null.
• It means the variable exists, but currently holds no meaningful data or object.
• When you log user to the console, it shows null, indicating the absence of a value.

Output:

null

null

6. Symbol (symbol)

The symbol data type in JavaScript is used to create unique and immutable values. Symbols are often used as unique identifiers for object properties, helping to avoid property name collisions, especially in large applications or libraries.

// Example of symbol
let id1 = Symbol('id');
let id2 = Symbol('id');

console.log(id1 === id2);

// Example of symbol
let id1 = Symbol('id');
let id2 = Symbol('id');

console.log(id1 === id2);

How It Works:

• id1 and id2 are both symbols with the same description, 'id'.
• Even though their descriptions are the same, each Symbol is unique.
• The expression id1 === id2 returns false because no two symbols are equal, even if they have the same description.

Output:

false

false

Symbols are commonly used to define hidden object properties or to avoid naming conflicts when extending objects.

7. BigInt (bigint)

The BigInt data type allows you to represent integers larger than the Number type can safely store. It’s especially useful when working with large integers in applications like cryptography or financial calculations. BigInts are created by appending n to the end of an integer.

// Example of BigInt
let regularNumber = 9007199254740991; // Max safe integer in JS
let bigNumber = 9007199254740991000000000000000000n;

console.log(regularNumber);
console.log(bigNumber);

// Example of BigInt
let regularNumber = 9007199254740991; // Max safe integer in JS
let bigNumber = 9007199254740991000000000000000000n;

console.log(regularNumber);
console.log(bigNumber);

How It Works:

• regularNumber holds the largest integer that can be accurately represented by the Number type.
• bigNumber uses the n suffix to define a BigInt, allowing representation of much larger values.
• The console.log() calls output both values to show the difference.

Output:

9007199254740991
9007199254740991000000000000000000n

9007199254740991
9007199254740991000000000000000000n

Note: You cannot mix BigInt with regular Number types in arithmetic operations directly. You must convert one to match the other.

What's Next?

Now that you know the basic data types in JavaScript, the next step is to learn how to work with them using operators and type conversion.