In this article, we will be diving into the concept of values in JavaScript and its various types. Understanding the different data types in JavaScript is important for writing efficient and effective code. This article is suitable for those who already have a basic knowledge of JavaScript and are interested in exploring its different data types. (Here is my article you might want to check out to know some basics: Introduction to JavaScript.)

We will be discussing the various data types in JavaScript including number, string, boolean, undefined, null, array, and object. By the end of this article, you will have a comprehensive understanding of values in JavaScript and the different types of values that exist.

Definition:

As we all know, computers have lots of data. We can read data, modify data, and create new data. Data in the computer's world is stored in form of long sequences of bits. Bits can hold only one of two values: 0 or 1, corresponding to the electrical values of off or on, respectively.

A typical computer has billions of bits in its volatile data storage (working memory) as well as nonvolatile storage (the hard disk or equivalent). Due to such an amount of bits, we might not be able to work with them efficiently, we must separate them into blocks according to their representation of information.

Well, these separated blocks of data are known as Values in JavaScript. Values are the data that a program processes. Although all values are made of bits, every value has a type that determines its role. Some values are numbers, some values are pieces of text, some values are functions, and so on.

These values can be used in various ways to manipulate and store data in a JavaScript program. Understanding the different types of values in JavaScript and how to work with them is an essential part of understanding the basics of the language.

Let's see How many types of values we have in JavaScript.

Types of values:

JavaScript supports a variety of data types and these values can be differentiated between Primitive and Non-primitive data types:

• Primitive data type: It's immutable, and cannot be changed.

  1. Number.

  2. String.

  3. Boolean

  4. undefined

  5. null

• Non-primitive data type: Reference data types are dynamic in nature.

  1. Object.

  2. Arrays.

  3. All others types of objects.

I have an article devoted to Primitive vs Non-primitive data types. Where I explain the differences between them in detail.

Numbers:

JavaScript supports both integers and floating-point numbers. Numbers in JavaScript are also used in mathematical operations such as addition, subtraction, multiplication, division, and modulus. They can also be used in comparison operations such as greater than, less than, and equal to. Understanding how to work with numbers in JavaScript is an important part of understanding the basics of the language.

Some examples of numbers in JavaScript include:

a. Integers: Whole numbers such as 75, -4, and 0.

b. Floating numbers: Numbers with decimal places such as 3.14, -9.8, & 0.1.

let num1 = 75;   // Integers
let num2 = 9.8; // Floating numbers
console.log(num1);
console.log(num2);

In this example, we define two variables, num1 & num2, with values of 75 & 9.8, respectively. num1 is an integer, which is a whole number. num2 is a floating-point number, which is a number with a fractional part. Then we log each of the two numbers to the console using the console.log() method.

The output would be in Browser's console:

Strings:

Strings are used to represent text and are enclosed in quotes (either single ' ' or double " " ) and can contain letters, numbers, and special characters.

Some examples of strings in JavaScript include:

let string1 = "Hello, world!";         // Text
let string2 = "1 2 3 4 5 6 7 8 9 0";   // Number
let string3 = "! @ # $ % ^ & * ( )";   // Special characters
console.log(string1);
console.log(string2);
console.log(string3);

In this example, we define 3 string variables: string1, string2, and string3. string1 is assigned the value "Hello, world!", which is a text string.

string2 is assigned the value "1 2 3 4 5 6 7 8 9 0", which is a string of numbers separated by spaces. string3 is assigned the value "! @ # $ % ^ & * ( )", which is a string of special characters. Then we log each of the three strings to the console using the console.log() method.

The output would be in Browser's console:

JavaScript has several built-in methods for working with strings such as indexOf(), and split(), and also support supports string concatenation, I will be discussing these methods in more detail in my article on String and its method in JavaScript.

Booleans:

Boolean values can only have one of two values: true or false. They are often used in decision-making and control flow statements to determine if a certain condition is met.

Take a look at the simple example below demonstrating how the boolean value can be used in programming:

let booleanValue = true;

if (booleanValue) {
  console.log("The value of Boolean is true");
} else {
  console.log("The value of Boolean is false");
}

In this example, the Boolean value booleanValue is used to determine what message to log to the console. If booleanValue is true, the message "The value of Boolean is true" will be logged. If booleanValue is false, the message "The value of Boolean is false" will be logged instead.

Here is the output in Browser's console:

undefined:

Represents the absence of a value, which means that a variable has been declared, but has not been assigned a value.

For example:

let noAssign;
console.log(noAssign); // Output:- undefined

In this example, the variable noAssign is declared but has not been assigned a value. When we log noAssign to the console, we will get the output as undefined because that's its value.

Here is the output in Browser's console:

null:

When a variable has been intentionally assigned a non-value. It indicates that a variable should have a value, but it is currently unknown.

For example:

let nonValue= null;
console.log(nonValue); // Output: null

In this example, the variable nonValue is declared and assigned the value null. When we log nonValue to the console, we will get the output as null because that's its value.

Here is the output in Browser's console:

Objects:

Objects can contain properties and methods and organize multiple pieces of data. Objects are similar to real-world objects in that they have properties and methods. Properties are like the characteristics of an object, and methods are like the actions an object can perform.

For example:

const object = {
    firstName: "Yasir",
    lastName: "Ansari",
};
console.log(object);

In this example, we define an object named object with two properties: firstName and lastName. The properties have string values of "Yasir" and "Ansari", respectively. Then we log the entire object to the console using the console.log()
method.

The output would be in Browser's console:

It's only about the object's basics that we have seen here. You can check out my article on Objects in JavaScript, where I explained everything about it such as Its properties, methods, Accessors, and constructors of objects in detail.

Arrays:

Arrays are a data type that allows you to store multiple values in a single variable. They are ordered and can contain elements of any data type.

For example:

// Any data type can be inserted into array.
let array= ["Hello World!", null, undefined, 75, true, {name: "Yasir"}];
console.log(array);

In this example, we define an array named array with six elements: "Hello World!" (a string), null, undefined, 75 (a number), true (a Boolean value), {name: "Yasir"} (an object). Then we log the entire array to the console using the console.log() method.

The output would be in Browser's console:

We have seen the array's basics here. It also has built-in methods like the string that can be used to manipulate the array's content. I have explained to them another article. You can check out my article on Array and its method, where I explained everything about it and its methods in detail.

Conclusion:

Values are the backbone of any programming language, and JavaScript is no exception. Understanding the different types of values in JavaScript and how to use them is essential. In this article, we went through the basics of values in JavaScript and explored its different types such as Number, String, Boolean, Null, Undefined, Array, and Object. We also learned how to convert values between different types and how to manipulate values in JavaScript. With this information, you should have a solid understanding of the values in JavaScript and be able to effectively use them in your projects.

A Value is one of the six fundamentals of JavaScript. In this article, we have learned about it. I have also covered the other five fundamentals in my articles individually. You can find them below:

• Variables in JavaScript.

• Operations in JavaScript.

• Decisions in JavaScript.

• Loops in JavaScript.

• Functions in JavaScript.

Thank you for reading. Feel free to comment on this, if found it useful.

Happy learning.😇😇😇