Code has been added to clipboard!

All About JavaScript Data Types: JavaScript TypeOf Explained

Reading time 5 min
Published Aug 8, 2017
Updated Oct 2, 2019

Every item in the world is classified and belongs to a specific type. Data in JavaScript is also classified into different categories, which can be identified using JavaScript typeOf operator.

In this tutorial, you'll learn all you need to know about JavaScript data types: what kinds there are, what's their purpose and usage. You'll learn to define what type in JavaScript is a number, word, or a function. Moreover, you'll learn how to include them into your code.

JavaScript Data Types: Main Tips

  • There are a few different data types in JavaScript: numbers, strings, booleans, objects, and arrays.
  • JavaScript data types are an important concept in programming. Lots of programming languages use classification for a better coding experience and bug-free code.
  • For the program to know how to treat a variable, it must know its data type.
  • Data type can be identified using JavaScript typeOf operator.

Declaration and Usage

In the example below, you can see the three most popular JavaScript types of data: number, string, and an object. These are treated differently by the program - numbers are shown as a number, strings are presented as words, and objects are seen as functions that come to reality. They return the value created in the function:

Example
var year = 2016; // Number
var firstName = "Wilson"// String
var person = {name:"Wilson"age:"old"}; // Object

Without distinct data types, JavaScript would have a problem adding two values together. Let's examine the example below:

Example
var xyz = "Audi" + 50;

When you're adding a number to a string, the system sees the number as a string as well. Therefore, JavaScript will treat the example above the same as the one below:

Example
var xyz = "Audi" + "50";

JavaScript uses dynamic data types. That means that you do not need to define a data type for a new variable specifically. One variable can hold a few JavaScript data types:

Example
var xyz; // The variable does not have a data type
var xyz = 44; // Now "xyz" is a Number
var xyz = "Bob"; // Now "xyz" is a String

Types Explained

In this chapter, we will explain to you each data type in detail. This way, you'll get a better understanding of what they represent and how to use them. Understanding the differences will let you avoid running into rookie mistakes.

Examples will follow each explanation. Don't hesitate to open them in the code editor and play around by clicking the Try it Live button!

Strings

Strings are JavaScript data types that hold information in text. They are encapsulated with quotes (unlike numbers, which do not need them). Both double and single quotes are accepted, but be careful and do not mix the two in one string!

Example
var car = "Audi 80";   // double quotes  
var car = 'Audi 80';   // single quotes

You might encounter a situation when you want to use quotes inside of a string. For that, you should use different quotes than the ones which define the string - look at the example below to see how it's done:

Example
var text = "It's sunny outside";      // Single quote inside double quotes  
var text = "It is called 'Audi'";     // Single quotes inside double quotes  
var text = 'It is called "Audi"';     // Double quotes inside single quotes

Numbers

JavaScript numbers can be written with or without decimals. As we already covered, they should never be written within quotes - otherwise, it will be read as strings.

Example
var x = 4.00;     // Written with decimals  
var y = 44;       // Written without decimals

However, with extremely large or small numbers, you can use scientific (exponential) notation:

Example
var y = 483e5;      // 12300000  
var z = 483e-5;     // 0.00123

Objects

One of JavaScript types of data are objects which are defined with curly braces. The object type must have a property and a value: they are written in propertyName:value pairs.

The example below creates an object called human that has four properties:

Example
var human = {
  firstName: "Bob", 
  lastName: "White", 
  age: 44, 
  eyeColor: "brown"
};

Booleans

A boolean is a data type that can have only on of two possible values: true or false. This is one of the JavaScript data types that is often used in conditional testing of code:

Example
var xyz = true;  
var xyz = false;

Arrays

JavaScript arrays are defined with square brackets. Arrays are one of those JavaScript data types that are commonly used with variables. Array items are normally separated with commas. The example below creates an array with three elements:

Example
var cars = ["Audi", "Mazda", "Volvo"];

Note: The first element of the array is always indexed as 0.

undefined and NULL

There are two more values we should discuss, as they tend to puzzle beginners. What's the difference between undefined and NULL, you might ask? Don't they both simply mean the absence of a value?

Well, not exactly.

If a variable does not have a value, JavaScript automatically sets it as undefined. In the example below, the variable has a name but does not have a value assigned. Without the value, we do not know what is the type of this variable, which makes it undefined. If you use JavaScript typeOf operator on an undefined JavaScript variable, the program will return undefined only:

Example
var human;   // Value is undefined, type is undefined

Now, JavaScript null also means nothing. The difference is that even though it has no value, it is considered to be an object. You can clear an object by setting it to JavaScript null. This also means that using typeOf JavaScript operator will identify this variable as an object:

Example
var  human = null;   // Value is null, but type is still an object

On the other hand, you can also clear out an object by setting it to undefined. In this case, it loses both its value and type. This means that using JavaScript typeOf operator will identify it not as an object but undefined JavaScript variable:

Example
var  human = undefined;   // Value is undefined, type is undefined

JavaScript Data Types: Summary

  • There are a few JavaScript types of data, which serve a different purpose in the code.
  • It is essential to use the correct syntax for data types so the browser understands your code.
  • You can use JavaScript typeOf operator to check what type of JavaScript data something is.
What Is JavaScript Used For?
Tutorial
Introduction
Output
Syntax
Comment
Commands
Operators
Comparison and Logical Operators
Data Types
Math.random()
Type Conversion
Function Definitions
Events
Objects
Object Properties
Prototype
Array
Sorting Arrays
Strings
Numbers
Number Format
Math Object
Onclick Event
Date
Date Formats
Scope
Regular Expressions
Reserved Words
Common Mistakes
Performance
Forms
Form Validation
Window: The Browser Object Model
Popup Boxes
Cookies
JSON
AJAX Introduction
AJAX Form
Automatic File Download
Functions
Array Methods
String Methods
Date Methods
Timing Events
Cheat Sheet
JavaScript in HTML
HTML DOM Methods
HTML DOM Changing HTML
HTML DOM Animation
HTML DOM EventListener
HTML DOM Navigation
HTML DOM NodeList
HTML DOM Element Nodes
Array Functions
Boolean
Calling a Function
Date Functions
Global Objects
Input Text
Operator
Statements
String Functions
Math
Math.random
Number
RegEx
alert
array.filter
array.length
array.map
array.reduce
array.push
array.sort
break and continue
className
confirm
decodeURIComponent
for
forEach
if
indexOf
innerHTML
location.reload
number.toString
onclick
onload
parseInt
prompt
replace
setAttribute
setInterval
setTimeout
slice
splice
string.includes
string.indexOf
string.split
style.display
submit
substr
substring
switch
test
throw, try and catch
toLowerCase
toUpperCase
use strict
while
window.history
window.location
window.navigator
window.screen