Data types in Javascript

Introduction

Javascript is a loosely typed language which doesn’t mean it has no types. There are various Data Types in Javascript which a developer needs to be aware of for writing bug free code and also for easier debugging. By the end of this 5-10min reading you will get a quick overview of various Data types available in Javascript and how to identify them.

What does Loosely Typed mean?

Almost every programming language has a concept called variables which are nothing but containers to hold data of different types like integer, string etc. In traditional strongly typed programming languages like C, C++, Java etc the way you create these variables decide what type of data it is going to hold through out the program and if you try to assign data which is not the designated type the compiler throws an Error.

int i;              // variable that can hold only an integer
i = 10;             // Works fine
i = "John Doe";     // Compiler Error due to Strongly Typed nature

Now that we understand how a Strongly typed programming language works, let’s understand how a Loosely typed language like Javascript would work. Though there are many Data types in Javascript there is only one way to create variables to hold any type of Data like number, string etc using a var keyword as shown below

var i;              // variable that can contain any type of data
i = 10;             // Works fine
i = "John Doe";     // no error due to Loosely Typed nature of JS

Data Types in Javascript

Data types in Javascript are primarily divided into two types

  • Primitive Types
  • Reference/Object Types

See Primitive vs Reference types for a deeper insight.

Primitive Types

Javascript supports 5 primitive types which are listed below:

  1. Boolean (true/false)
  2. Number
  3. String
  4. Null
  5. Undefined

All primitive types can be identified using typeof operator except for null. typeof operator identifies null as an object which is an important Javascript quirk to be aware of. The best way to check if variable is null is by comparing it to null.

var name = "Techbuk";     // string
var age = 20;             // number
var isAdult = true;       // boolean
var email = null;         // null
var address = undefined;  // undefined

console.log(typeof name);    // prints "string"
console.log(typeof age);     // prints "number"
console.log(typeof isAdult); // prints "boolean"
console.log(typeof address); // prints "undefined"

console.log(typeof email)    // prints "object" ** JAVASCRIPT QUIRK **
console.log(email === null); // prints "true"

Reference Types

Javascript supports 6 reference types which are listed below:

  1. Array
  2. Date
  3. Function
  4. Object
  5. Regexp
  6. Error

All reference types can be identified using instanceof operator except for Arrays which might not be correctly identified in some cases. Hence it is recommended to use Array.isArray() to check for an Array as shown in the code example below:

var obj = {};              // Object
var arr = [1,2,3,4];       // Array
var date = new Date();     // Date
var fn = function() {};    // Function
var re = /Techbuk/i;       // RegExp
var err = new Error();     // Error

console.log(obj instanceof Object);   // prints true
console.log(date instanceof Date);    // prints true
console.log(fn instanceof Function);  // prints true
console.log(re instanceof RegExp);    // prints true
console.log(err instanceof Error);    // prints true

 ** JAVASCRIPT QUIRK **
console.log(instanceof arr) // might not work as expected in some cases
console.log(Array.isArray(arr)); // Do this instead
                                 // prints true

NOTE: typeof operator doesn’t work well with reference types hence it is recommended to use instanceof instead.

Conclusion

Though Javascript is a loosely typed language it supports 5 primitive types and 6 Reference types which are important to get comfortable with for any Javascript developer. Javascript typeof and instanceof operators can be leveraged to identify the types of variables.