Data types in Javascript explained

All programming languages have built-in data structures. A built-in type means that the programming language provides built-in support. Not every language is the same, hence, there are some differences between the data types and data structures. This article is about a key JavaScript concept Data Types.

Data Types

JavaScript is a loosely typed and dynamic language. We can put any type in a variable. For example:

// NUMBER
let message = 1;
// STRING
message = 'Hello';

💰 The Pragmatic Programmer: journey to mastery. 💰 One of the best books in software development, sold over 200,000 times.

The current ECMAScript Specification lists the following data types:

• Undefined
• Null
• Boolean
• String
• Symbol
• Numeric (Number, BigInt)
• Object

In Javascript there are seven primitive types, everything else is an object, including functions and arrays. There are two numeric data types Number and BigInt.

Undefined

undefined is the absence of a defined value. If a variable is declared or initialized, but not assigned or initialized with a value, then its value is undefined.

let name;
console.log(name);
console.log(typeof name);
// name is undefined

A function without a return statement will return undefined. Any expression that tries to access a non-existent property on an object will also result in undefined.

Null

In contrary to other languages, the null primitive is not a “reference to a non-existing object”, or a “null pointer”. It is typically used to describe the absence of a value and represents "nothing" or "empty".

let name = null;

Boolean

The Boolean type represents a logical entity having two values, called true and false. It is commonly used to store yes/no values, for example:

let isActive = true;
let hasPaid = true;

A common naming convention for boolean variables is to start with is or has.

String

Strings in JavaScript can be created with single or double quotes, or backticks. Strings created with backticks are template strings. Template strings can be multiline and support interpolation. Normal strings can only be concatenated together using the plus (+) operator.

const firstName = 'Mario';
const email = '[email protected]'; // or "[email protected]"
const sentence = `The email address of ${firstName} is ${email}.`;

A string may consist of zero characters (be empty), one character or many of them.

Symbol

The Symbol type is the set of all non-String values that may be used as the key of an Object property. Each possible Symbol value is unique and immutable. Each Symbol value immutably holds an associated value called Description that is either undefined or a String value.

The Symbol.for method creates/gets a global symbol.

Number

The Number type is double-precision floating-point format and allows both integer and decimals. It has a built-in limitation, the integer range must be in-between -(2^53-1) to (2^53-1). The BigInt type has no upper or lower limit on integers.

const age = 100;
alert(age / 10 / 2); // will alert 5

There are many operations for numbers available (multiplication *, division /, addition +, subtraction -, etc.), so doing math in Javascript is somewhat safe. The script will not stop with a fatal error, instead we get a NaN as a result. NaN is sticky, so any further operation on NaN will always return NaN.

BigInt

Since the technical limitations of Number type with the built-in limitation range for integer values, a new numeric type had to be created. BigInt type was recently added to JavaScript to represent integers of arbitrary length. A BigInt value is created by appending n to the end of an integer:

const bigInt = 1234567890123456789012345678901234567890n;

BigInt is currently not supported by IE, please check the compatibility tale at MDN for a full supported list with versions.

Object

Other than the above primitive types, it's an Object in JavaScript, including functions. An object is a set of key value pairs, where values can be any primitive type, or an object (including functions). Object keys are called properties. Objects allow for nested data structures, when an object with a key holds an object as a value, for example:

const person = {
  name: 'Mario',
  age: 37,
  // address is a nested object
  address: {
    street: 'Main Street',
    zipCode: 0000,
    countryCode: 'AT',
  },
};

// address can be logged with bracket or dot notation
console.log(person.address);
// or
console.log(person['address']);

All JavaScript objects have prototypes.

A prototype is an implicit reference to another object that is queried in property lookups.

If an object doesn't have a particular property, the object's prototype is checked for that property. If the object's prototype does not have that property, the object's prototype's prototype is checked and so on. This is how inheritance in JavaScript works, JavaScript is a prototypal language.

TL;DR

• JavaScript is a loosely typed and dynamic language.
• JavaScript has seven primitive data types.
• If it's not a primitive, that it is an Object data type.
• Functions and Arrays are Object data types.

Thanks for reading and if you have any questions, use the comment function or send me a message @mariokandut.

If you want to know more about Javascript, have a look at these Javascript Tutorials.

References (and Big thanks)

MDN, JSNAD, ECMA