JavaScript Data Types

In JavaScript, there is a delineation between object data types and primitive data types. The following primitive data types exist:

String
Number
Boolean
undefined
null

We can create variables of these types as follows:

var str = "I am a string";  
var num = 23;  
var bool = true; // other alternative is false  
var undef = undefined;  
var nu = null;

Observe that JavaScript does not have separate data types for floating point numbers and integers. Instead, only the Number data type is exposed to the developer, which is a floating point number. Thus var num = 23 has the same type as var num = 23.7. JavaScript is often attacked because of that, since floating point arithmetic produces results such as the statement 0.1 + 0.2 === 0.3 evaluating to false, but this problem is a characteristic of floating point numbers themselves and how they are stored in memory (see http://floating-point-gui.de/).

In JavaScript, we can check the type of a primitive via the typeof command: For our above defined variables,
typeof str returns "string", typeof num returns "number", typeof bool returns "boolean", typeof undef returns "undefined" and finally, typeof nu returns "object". What did I just write? Yeah, it is unfortunate that we do not get back null in this case, which is a quirk in the language. Instead, we need to use nu === null to check whether the variable nu is equal to null and are not able to get this information via the typeof operator.

Primitives are created directly in memory. When we assign

var num1 = 23;  
var num2 = num1;  
num1 += 3;

num1 will hold the value 26 and num2 will still be 23. When creating num2, a copy of num1 is created and assigned to num2 in memory. This might seem obvious, but this bevahiour is fundamentally different from objects which are going to be covered next. Everything else besides the aforementioned primitive data types in JS is an object. We can create a simple object via one of the following ways, where the first is the most common one:

var obj1 = {};  
var obj2 = new Object();  
var obj3 = Object.create( Object.prototype );

A JavaScript object is a collection of key-value pairs. Each value can be of any of the data types in JavaScript. We can define them as follows:

var jedi = {}  
jedi.name = "Luke Skywalker"  
jedi.age = 34  
jedi.alive = true;

which yields the same result as supplying the properties at creation:

var jedi = {  
  name: "Luke Skywalker",
  age: 34,
  alive: true
}

As we can see, we can at run-time change objects as we please: We can add properties and augment their functionality this way. In fact, a property cannot only be one of the primitive data types, but an object itself:

var jedi = {  
  name: "Luke Skywalker",
  age: 34,
  alive: true,
  father: {
    name: "Anakin Skywalker",
    age: 57,
    alive: false
  }
}

We can access the properties of an object either using dot notation or bracket notation:

jedi.name === "Luke Skywalker" // returns true  
jedi["name"] ===  "Luke Skywalker" // returns true

The former is the de facto standard, but the latter is useful if we instead of a string literal supply a variable holding that string, e.g. as in

var prop = "alive";  
jedi[prop] === true // returns true

Also, if a property of an object has a name which is a reserved keyword in JS (such as class), we are forced to use the bracket notation, as the dot notation would throw an error.

In contrast to the primitives, objects are assigned by reference. Therefore, they are often also called reference types. This means that when we have assigned the object literal {} to the variable jedi, we are effectively creating a pointer which refers to the object. Hence, if we do the following

var obj1 = {};  
var obj2 = obj1;  
obj1.str = "I am a string";

then invoking console.log( obj2.str ) will print out "I am a string". The reason is that var obj2 = obj1 does not create a copy of the object referenced by obj1, but only copies the pointer so that as a result both obj1 and obj2 reference the same object in memory. Subsequently, if the properties of this object change, this affects both obj1 and obj2. Besides the basic JavaScript object, there are the following data types which all inherit from Object.prototype:

Array
Function

and not as importantly

Date
RegExp
Error

Finally, there is the Math object which behaves quite differently from the rest, so I have excluded it from above list.

Of the Object types, the most important are without a doubt functions. It is often said that JavaScript has many traits of a functional language. What is meant by this statement is that functions are first-class objects which can behave as any other object: They can have properties (which could even be other functions, so a function can have its own methods!) and they can be passed as arguments to other functions. This proves to be immensely useful, and a good understanding of functions is essential as they are also the main building block for object-oriented design in JS.

← Philipp Burckhardt