Introduction to Data Types

Data types are the most fundamental concepts of programming language. Just like any other programming language Javascript has it's own data types.

JavaScript gives us the ability to specify what type of information will be stored in a variable.

So we can initialize any type to a variable and that variable can be used to hold different data types and that's because variables are not directly associated with any particular value type.

So programming languages that allow us to assign and to reassign different data types are weakly typed or dynamically typed language.

JavaScript is both Dynamically typed and Weakly typed.

Data types

JavaScript provides different data types to hold different types of values. There are two types of data types in JavaScript.

1. Primitive data types.

2. Non-primitive data types (Object References)

Data types that are known as primitive values in JavaScript are numbers, strings, booleans, Bigint, undefined and Symbol.

Objects such as functions and arrays are referred to as non-primitive values.

Primitives are known as being immutable data types because there is no way to change a primitive value once it gets created.

Non-primitive or Referential values are mutable data types. The value of an object can be changed after it gets created.

typeof() operator

The JavaScript typeof operator can be used to find the type of a JavaScript variable or an expression. It can be used with primitive and non-primitive data types alike. It takes a variable or expression as argument and returns the type of the argument as string (eg: number, object, string etc). We are going to use that operator below as we discuss all the data types. Try the examples below in the console!

1. Primitive Data types:

Six Data Types that are primitives, checked by typeof operator.

typeof "John"         // Returns "string"
typeof 314            // Returns "number"
typeof 3.14           // Returns "number"

1. Number

This data type can hold integers from -Infinity to +Infinity including floating-point numbers.

var a = 4;
console.log(typeof(a)); // "number"
var b = 5.99;
console.log(typeof(b)); // "number"

2. Undefined

Undefined is a global variable which represents the non-existence of data. When you try to access a value that does not exist, the result will be undefined.

var x;
console.log(x)

3. Boolean

Booleans are the logical values, either true or false.

//This is primitive boolean { The typeof operator returns String }
var isLoggedIn = false;
console.log(typeof(isLoggedIn));  // boolean

4. String

A string is a sequence of characters used to represent text. It must be enclosed in single or double quotation marks.

var name = "Developer";
console.log(typeof(name)); // string

5. Bigint

Bigint is a numeric data type that can represent integers in the arbitrary precision format.

Take int as an example. It has a fixed amount of bits available. With that you can save values between -2,147,483,648 and 2,147,483,647 (inclusive). So it is a fixed-precision type and not an arbitrary-precision type. It can not store values outside of this range.

With BigInteger, you don't have that problem, because once the assigned bits are not enough to store the exact value, Bigint will just add some bits so it can handle the value again.

With arbitrary precision integers, the integers can be as large as you need ("arbitrarily large") and the library will keep all the digits down to the least significant unit. (This is obviously limited by the amount of memory in your computer.)

6. Symbol

A “symbol” represents a complete unique identifier. A value of this type can be created using Symbol():

// id is a new symbol
let id = Symbol();

Every symbol returned by Symbol() is unique, so every symbol has its own identity:

You can see that symbols are primitive if you apply the typeof operator to one of them — it will return a new symbol-specific result:

>typeof symbol
'symbol'

NOTE

Primitive values have to be stored somewhere in our memory, and it is stack.

Non-primitive Data types (Object References)

1. Object

In JavaScript, an object data type is used to store the collection of data. Object's properties are written as key:value pairs, which are separated by commas and enclosed within curly braces { }.

let user = new Object(); // "object constructor" syntax.
let user = {};  // "object literal" syntax

let got = { 
       firstname: "John", 
       lastname: "Snow", 
       role: "heir to the Iron Throne"
};

The data of an object can be accessed by the following syntax.

Syntax:

ObjectName.keyName = If key is a String. eg key, some_key, someOtherKey123 etc
ObjectName[keyName] = if the key is a number, or if it starts with a number or if it is a string joined by characters like - eg ("some-word")

var obj = {
  name: "Lionel Messi",
  age: 33,
  role: "Forward - Right Winger"
};

console.log(obj.name); // "Lionel Messi"
console.log(obj.age); // 33

Note: There are non-primitive variants for boolean, number etc.

Example:

//This is Composite boolean  { The typeof operator returns Object }

var bool1 = new Boolean(""); // false

var bool2 = new Boolean(0); // false

var bool3 = new Boolean(undefined); // false

var bool4 = new Boolean(null); // false

var bool5 = new Boolean(NaN); // false

var bool6 = new Boolean("some text"); // true

var bool7 = new Boolean(1); // true

2. Array

JavaScript Array data type is written inside a pair of square brackets [ ] and is used to store multiple values of the same datatype be it strings, numbers etc.

The items in a JavaScript array are also written in a comma-separated manner.

//Creating an Array

var numbers = [10, 20, 30, 40, 50]; // array of numbers
var cars = ["Ferrari", "Lambo", "BMW", "Maseratti"];

Note

You can access the value of the array by its index. Every array has an index that starts with 0.

[0] is the first element. [1] is the second element and so on.

Arrays use numbers to access its "elements". In this example, person[0] returns John:

var person = ["John", "Doe", 46]; 
// In this example person[0] returns John.

Arrays are objects

Arrays are a special type of objects. The typeof operator in JavaScript returns "object" for arrays.

The typeof returns object for array selectedColors

let slelectedColors = ["red", "green"];
selectedColors[2] = 1;
console.log(selectedColors);

// typeOf(selectedColors) 
  'Object'

Function

A JavaScript function is a block of code designed to perform a particular task. A JavaScript function is executed when "something" invokes it (calls it).

Why Functions?

You can reuse code: Define the code once, and use it many times.
You can use the same code many times with different arguments, to produce different results.

A Function is defined by using the function keyword followed by the function name and parentheses ( ), to hold inputs(parameter1, parameter2) if any.

A function can have zero or more parameters separated by commas.

// creating a function
function myFun(a, b) {
  return a * b;   // The function returns the product of a and b
}

Functions can be parameterized and non-parameterized which means they may or may not take any input.

Function Return

When JavaScript reaches a return statement, the function will stop executing.

If the function was invoked from a statement, JavaScript will "return" to execute the code after the invoking statement.

var x = myFunction(4, 3);   // Function is called, return value will end up in x

function myFunction(a, b) {
  return a * b;             // Function returns the product of a and b
}

//The result in x will be : 12

Functions are also objects

Functions are also maintained as objects. However, they are special as they are invocable (callable).

The typeof returns function for functions however, functions can still be given key-value pairs just like objects.s

function hello(){
 console.log("hello")
}
hello.a = 1
hello.b = 2

// works fine

typeof(hello) // "function"

Note :

Non-primitive values are stored in a Heap.

Hope this was useful! Let me know in the comments.

Data types in Javascript