Class 043 — JavaScript Data Types

JavaScript programs work with different types of data.

A value can be text, a number, true or false, empty, a very large integer, a unique value, or an object.

The type of data represented by a value is called its Data Type.

The primitive data types in JavaScript include:

String
Number
Boolean
Undefined
Null
BigInt
Symbol

Object is a reference type.

The goal of this class is not only to memorize the definitions of Data Types. You should understand where, why, and how different types of data are used in JavaScript.

LEARNING OBJECTIVES

After completing this class, you will be able to:

Understand JavaScript Data Types.
Understand Primitive Data Types.
Work with String values.
Work with Number values.
Understand Boolean values.
Understand Undefined.
Understand Null.
Understand the basic concept of BigInt.
Understand the basic concept of Symbol.
Understand Object as a reference type.
Use typeof to inspect data types.
Explain practical Data Type examples.
Identify common Data Type mistakes.
Complete practical exercises.
Answer basic interview questions about JavaScript Data Types.

WHAT IS A DATA TYPE?

A Data Type describes what kind of data a value represents.

Example:

const userName = “Rahim”;

const age = 25;

const isStudent = true;

Here:

“Rahim”

String

25

Number

true

Boolean

Understanding Data Types is important because different types of values can behave differently in JavaScript.

WHY ARE DATA TYPES IMPORTANT?

Consider:

const price = 500;

Here:

500

is a Number.

Therefore, we can perform mathematical operations with it.

Example:

console.log(price + 100);

Output:

600

Now consider:

const price = “500”;

Here:

“500”

is a String.

If we write:

console.log(price + 100);

Output:

500100

The behavior is different because “500” is text rather than a numeric value.

This is one reason why understanding Data Types is essential.

PRIMITIVE DATA TYPES

The primitive data types in JavaScript include:

String
Number
Boolean
Undefined
Null
BigInt
Symbol

Let us understand each one.

STRING

A String represents textual data.

Example:

const name = “Rahim”;

Here:

“Rahim”

is a String.

Strings can be created using different types of quotes.

Double Quotes:

const city = “Dinajpur”;

Single Quotes:

const country = ‘Bangladesh’;

Backticks:

const course = Web Development;

All three examples create String values.

STRING EXAMPLES

const firstName = “Rahim”;

const lastName = “Ahmed”;

const email = “rahim@example.com“;

const productName = “Gaming Keyboard”;

console.log(firstName);

console.log(productName);

Output:

Rahim
Gaming Keyboard

NUMBER INSIDE QUOTES

A number written inside quotes is a String.

Example:

const phoneCode = “12345”;

Here:

“12345”

is not a Number.

It is a String.

Check it with:

console.log(typeof phoneCode);

Output:

string

STRING CONCATENATION

Multiple Strings can be joined together.

Example:

const firstName = “Rahim”;

const lastName = “Ahmed”;

const fullName =
firstName + ” ” + lastName;

console.log(fullName);

Output:

Rahim Ahmed

This is called String Concatenation.

TEMPLATE LITERAL

Backticks allow us to insert values into a String conveniently.

Example:

const name = “Rahim”;

const message =
Hello, ${name}!;

console.log(message);

Output:

Hello, Rahim!

This is called a Template Literal.

NUMBER

The Number type is used for ordinary numeric values in JavaScript.

Example:

const age = 25;

const price = 1500;

const temperature = 36.5;

All of these are Number values.

Check:

console.log(typeof age);

Output:

number

NUMBER EXAMPLE

const price = 1000;

const quantity = 3;

const total =
price * quantity;

console.log(total);

Output:

3000

DECIMAL NUMBERS

The Number type can represent decimal values.

Example:

const rating = 4.8;

const temperature = 36.5;

console.log(typeof rating);

Output:

number

NEGATIVE NUMBERS

Example:

const temperature = -5;

This is also a Number.

NaN

JavaScript has a special numeric value called:

NaN

NaN means:

Not-a-Number

Example:

const result =
Number(“Hello”);

console.log(result);

Output:

NaN

An important JavaScript behavior is:

console.log(typeof NaN);

Output:

number

Although the name means “Not-a-Number”, typeof NaN returns:

number

INFINITY

JavaScript can also represent Infinity as a Number value.

Example:

console.log(1 / 0);

Output:

Infinity

BOOLEAN

Boolean represents logical values.

A Boolean has two possible values:

true

false

Example:

const isLoggedIn = true;

const isAdmin = false;

Check:

console.log(typeof isLoggedIn);

Output:

boolean

BOOLEAN EXAMPLES

const isAvailable = true;

const isPaid = false;

const hasPermission = true;

const isCompleted = false;

Boolean values are commonly used to represent conditions and application states.

PRACTICAL BOOLEAN EXAMPLE

const productInStock = true;

if (productInStock) {

console.log(
    "Product is available"
);

}

Output:

Product is available

Do not worry about the if statement yet.

Conditional statements will be covered properly in a later JavaScript class.

This example only demonstrates a practical use of Boolean values.

UNDEFINED

When a variable has been declared but no value has been assigned to it, its value is usually:

undefined

Example:

let userName;

console.log(userName);

Output:

undefined

Check:

console.log(typeof userName);

Output:

undefined

Another example:

let price;

console.log(price);

Output:

undefined

The variable exists, but it currently has no explicitly assigned value.

NULL

null is commonly used to intentionally represent the absence of a value.

Example:

let selectedProduct = null;

This can mean:

The selectedProduct variable exists, but currently no product has been selected.

Another example:

const currentUser = null;

Here, null intentionally represents no current user.

NULL VS UNDEFINED

Undefined:

A value has not been assigned.

Example:

let userName;

Output:

undefined

Null:

The developer intentionally represents an empty or absent value.

Example:

let selectedUser = null;

Understanding this distinction is important.

IMPORTANT JAVASCRIPT BEHAVIOR

Check:

console.log(typeof null);

Output:

object

This is a historical behavior of JavaScript.

Even though:

typeof null

returns:

object

null itself is a primitive value.

BIGINT

BigInt is used for integer values that may be too large to represent safely with the Number type’s normal integer precision.

Example:

const bigNumber =
123456789012345678901234567890n;

Notice the:

at the end.

Check:

console.log(typeof bigNumber);

Output:

bigint

Another example:

const largeValue =
9007199254740993n;

console.log(largeValue);

BIGINT CREATION

BigInt can also be created using:

BigInt()

Example:

const value =
BigInt(12345);

console.log(typeof value);

Output:

bigint

IMPORTANT BIGINT NOTE

You cannot directly mix Number and BigInt values in ordinary arithmetic.

Example:

const big = 10n;

const normal = 5;

console.log(big + normal);

This produces an error.

Instead:

const big = 10n;

const anotherBig = 5n;

console.log(big + anotherBig);

Output:

15n

SYMBOL

Symbol is a primitive type used to create unique values.

Example:

const id =
Symbol();

Check:

console.log(typeof id);

Output:

symbol

A description can also be provided:

const userId =
Symbol(“userId”);

Each newly created Symbol is unique.

Example:

const id1 =
Symbol(“id”);

const id2 =
Symbol(“id”);

console.log(
id1 === id2
);

Output:

false

Even though both Symbols have the same description:

“id”

they are different Symbol values.

WHERE IS SYMBOL USED?

Symbol can be used for purposes such as unique property keys and JavaScript language protocols.

For now, remember:

Symbol

Unique Primitive Value

You will encounter more advanced uses later.

OBJECT

Object is a reference type.

Objects allow related data to be grouped using properties.

Example:

const user = {

name: "Rahim",

age: 25,

isStudent: true

};

Here:

user

is an Object.

Check:

console.log(typeof user);

Output:

object

OBJECT PROPERTIES

Example:

const product = {

name: "Keyboard",

price: 1500,

inStock: true

};

Access properties:

console.log(product.name);

console.log(product.price);

Output:

Keyboard
1500

Objects will be covered in detail in a later class.

For now, understand their basic role as a Data Type.

PRIMITIVE VS REFERENCE TYPE

Primitive Types:

String
Number
Boolean
Undefined
Null
BigInt
Symbol

Reference Type:

Object

This is one of the most important classifications to remember from this class.

THE TYPEOF OPERATOR

JavaScript provides:

typeof

to inspect the type of a value.

Example:

const name = “Rahim”;

console.log(typeof name);

Output:

string

Example:

const age = 25;

console.log(typeof age);

Output:

number

Example:

const active = true;

console.log(typeof active);

Output:

boolean

CHECKING MULTIPLE DATA TYPES

const userName = “Rahim”;

const age = 25;

const isStudent = true;

let address;

const selectedProduct = null;

const largeNumber = 100n;

const uniqueId = Symbol(“id”);

const user = {
name: “Rahim”
};

console.log(typeof userName);

console.log(typeof age);

console.log(typeof isStudent);

console.log(typeof address);

console.log(typeof selectedProduct);

console.log(typeof largeNumber);

console.log(typeof uniqueId);

console.log(typeof user);

Output:

string
number
boolean
undefined
object
bigint
symbol
object

Remember the special case:

typeof null

returns:

object

PRACTICAL USER PROFILE EXAMPLE

const userName = “Rahim”;

const age = 25;

const isVerified = true;

let phoneNumber;

const profilePicture = null;

console.log(userName);

console.log(age);

console.log(isVerified);

console.log(phoneNumber);

console.log(profilePicture);

The Data Types are:

userName

String

age

Number

isVerified

Boolean

phoneNumber

Undefined

profilePicture

Null

PRACTICAL PRODUCT EXAMPLE

const productName =
“Gaming Keyboard”;

const price =
2500;

const inStock =
true;

const discount =
null;

console.log(
typeof productName
);

console.log(
typeof price
);

console.log(
typeof inStock
);

console.log(
discount
);

Output:

string
number
boolean
null

STRING VS NUMBER

This is an important beginner concept.

Example 1:

const value1 = 10;

const value2 = 20;

console.log(
value1 + value2
);

Output:

Now:

const value1 = “10”;

const value2 = “20”;

console.log(
value1 + value2
);

Output:

1020

Why?

Because:

10 + 20

uses Numbers.

But:

“10” + “20”

joins Strings.

TYPE CONVERSION PREVIEW

Sometimes data needs to be converted from one type to another.

Example:

const inputValue = “100”;

const numberValue =
Number(inputValue);

console.log(numberValue);

Output:

100

Check:

console.log(
typeof numberValue
);

Output:

number

You will study type conversion in more detail later.

COMMON MISTAKES

CONFUSING STRING WITH NUMBER

Example:

const price = “500”;

This is String, not Number.

USING QUOTES AROUND BOOLEAN

Wrong for a Boolean value:

const isActive = “true”;

This is a String.

Boolean:

const isActive = true;

CONFUSING NULL WITH UNDEFINED

Example:

let user;

user is:

undefined

But:

let user = null;

means an intentionally absent value.

THINKING TYPEOF NULL RETURNS “NULL”

It does not.

Example:

console.log(typeof null);

Output:

object

This is a historical JavaScript behavior.

MIXING BIGINT AND NUMBER DIRECTLY

Problem:

console.log(
10n + 5
);

This causes an error.

THINKING SAME-DESCRIPTION SYMBOLS ARE EQUAL

Example:

const a = Symbol(“id”);

const b = Symbol(“id”);

console.log(a === b);

Output:

false

IGNORING DATA TYPES

Many JavaScript bugs occur because developers make incorrect assumptions about the type of a value.

Always understand what type of data your program is working with.

NEW & DIFFICULT WORDS

Data Type = Classification describing what kind of data a value represents.

Primitive = Basic JavaScript value type that is not an object.

String = Textual data.

Number = Numeric data type used for ordinary numbers.

Boolean = Logical data with true or false values.

Undefined = Value commonly produced when no value has been assigned.

Null = Primitive value commonly used to intentionally represent no value.

BigInt = Primitive type used for arbitrarily large integer values.

Symbol = Primitive type used to create unique values.

Object = Reference type used to group data using properties.

Reference Type = Type where object values are handled through references.

typeof = JavaScript operator used to inspect the type of a value.

NaN = Not-a-Number.

Infinity = Numeric value representing mathematical infinity.

Concatenation = Joining values, especially Strings.

Template Literal = String syntax using backticks that supports interpolation.

Interpolation = Inserting values into a String expression.

Property = Named value stored inside an Object.

IMPORTANT NOTES

The main Data Types from this class are:

Primitive:

String
Number
Boolean
Undefined
Null
BigInt
Symbol

Reference Type:

Object

Remember:

“100”

String

100

Number

true

Boolean

“true”

String

let value;

undefined

const value = null;

intentional absence of value

typeof null

“object”

BigInt example:

100n

Symbol example:

Symbol(“id”)

Object example:

const user = {
name: “Rahim”
};

PRACTICE

Create a String variable.
Create a Number variable.
Create a Boolean variable.
Declare a variable without assigning a value.
Print the Undefined value.
Create a variable with null.
Create a BigInt.
Create a Symbol.
Create an Object.
Use typeof with a String.
Use typeof with a Number.
Use typeof with a Boolean.
Use typeof with Undefined.
Check typeof null.
Check typeof BigInt.
Check typeof Symbol.
Check typeof Object.
Compare “10” + “20” with 10 + 20.
Create two Symbols with the same description and compare them.
Create a practical product object.

ASSIGNMENT

Create a file called:

data-types.js

Write:

const studentName =
“Rahim”;

const age =
25;

const isStudent =
true;

let phoneNumber;

const selectedCourse =
null;

const largeNumber =
12345678901234567890n;

const studentId =
Symbol(“studentId”);

const student = {

name: "Rahim",

age: 25

};

Now print every value:

console.log(studentName);

console.log(age);

console.log(isStudent);

console.log(phoneNumber);

console.log(selectedCourse);

console.log(largeNumber);

console.log(studentId);

console.log(student);

Then check every type:

console.log(
typeof studentName
);

console.log(
typeof age
);

console.log(
typeof isStudent
);

console.log(
typeof phoneNumber
);

console.log(
typeof selectedCourse
);

console.log(
typeof largeNumber
);

console.log(
typeof studentId
);

console.log(
typeof student
);

Write down the output and identify each Data Type.

QUIZ

What is a Data Type?

Answer:

A Data Type describes what kind of data a value represents.

What are the seven primitive types covered in this class?

Answer:

String, Number, Boolean, Undefined, Null, BigInt and Symbol.

What is the reference type introduced in this class?

Answer:

Object.

What is the type of:

“Hello”

Answer:

String.

What is the type of:

100

Answer:

Number.

What is the type of:

true

Answer:

Boolean.

What is the value of an uninitialized let variable?

Answer:

undefined.

What is null commonly used for?

Answer:

To intentionally represent an absent or empty value.

What does typeof null return?

Answer:

“object”

Is null still a primitive value?

Answer:

Yes.

How can a BigInt literal be written?

Answer:

By adding n after an integer.

Example:

100n

Can Number and BigInt be directly mixed in normal arithmetic?

Answer:

No.

What is special about Symbol?

Answer:

Each newly created Symbol value is unique.

What does typeof Symbol(“id”) return?

Answer:

“symbol”

What does typeof {} return?

Answer:

“object”

INTERVIEW QUESTIONS

Q: What are JavaScript Data Types?

Answer:

Data Types classify the different kinds of values that JavaScript programs can work with.

Q: What are the primitive types in JavaScript?

Answer:

String, Number, Boolean, Undefined, Null, BigInt and Symbol.

Q: What is a reference type in JavaScript?

Answer:

Object is the primary reference type introduced in this class.

Q: What is the difference between null and undefined?

Answer:

undefined commonly means that a value has not been assigned, while null is commonly used to intentionally represent the absence of a value.

Q: What does typeof null return?

Answer:

It returns “object” because of a historical JavaScript behavior, even though null is a primitive value.

Q: What is BigInt?

Answer:

BigInt is a primitive type used for integer values beyond the safe integer precision normally available with Number.

Q: What is Symbol?

Answer:

Symbol is a primitive type used to create unique values.

Q: What is the difference between “100” and 100?

Answer:

“100” is a String, while 100 is a Number.

Q: What is typeof used for?

Answer:

typeof is an operator used to inspect the type of a JavaScript value.

CLASS SUMMARY

In Class 43, you learned JavaScript Data Types.

You learned:

Data Types
Primitive Types
String
Number
Boolean
Undefined
Null
BigInt
Symbol
Object as a reference type
typeof
String vs Number
Null vs Undefined
NaN
Infinity
Basic type conversion
Practical Data Type examples

The core concept to remember is:

Primitive Types:

String
Number
Boolean
Undefined
Null
BigInt
Symbol

Reference Type:

Object

NEXT CLASS:

Class 044 — Operators

JavaScript Data Types: String, Number, Boolean, Undefined, Null, BigInt, Symbol & Object — Web Development Class 43

“Rahim”

25

true

Symbol

userName

age

isVerified

phoneNumber

profilePicture

“100”

100

true

“true”

let value;

const value = null;

typeof null

Leave a Reply Cancel reply