Primitives and Objects

There are two types of data in JavaScript:

  • Primitives
  • Objects

Primitives

String

A string must be surrounded by quotes. There are three types of quotes:

index.js
1
//singlequote
2
constfirstName='Davina';
3
4
//doublequote
5
constmiddleName="Holderness";
6
7
//backticks
8
constsurName=`Ashton`;
9

Each of the above are valid strings in JavaScript.

Number

An integer is a whole number.

A float is a number with a decimal.

In JavaScript, the type 'number' represents both integers and floats

index.js
1
constage=10;
2
console.log(typeofage);
3
//number
4
5
constheight=5.5;
6
console.log(typeofheight);
7
//number
8

Boolean

A boolean value can only be true or false.

index.js
1
constitIsSunnyInEngland=false;
2
console.log(typeofitIsSunnyInEngland);
3
//boolean
4
5
consthummusIsDelicious=true;
6
console.log(typeofhummusIsDelicious);
7
//boolean
8

Null

Null means it is empty or the value is unknown. Strangely, the type of null is an object in JavaScript.

index.js
1
constitIsNull=null;
2
3
console.log(typeofitIsNull);
4
//object
5

Undefined

Undefined means the value is not set.

During the creation phase of the global execution context, all variables initially have an undefined value.

You should avoid assigning undefined to variables, but instead use null.

We use undefined to check if a variable has been declared and if a value is assigned to it.

index.js
1
console.log(age)
2
//UncaughtReferenceError:ageisnotdefined
3

We see here that undefined means the variable is declared, but a value has not been assigned to it:

index.js
1
varage;
2
console.log(age)
3
//undefined
4

It is only when a value is assigned to it, that it stops being undefined :

index.js
1
varage=21;
2
console.log(age)
3
//21
4

Symbol

For a detailed explanation:

https://www.keithcirkel.co.uk/metaprogramming-in-es6-symbols/

Objects

Objects are a collection of key:value pairs. The key is a string, the value can be anything.

index.js
1
constowner={
2
name:'Toby',
3
}
4
5
constcat={
6
color:'ginger',
7
type:'Tabby',
8
paws:4,
9
owner:owner,
10
lives:[1,2,3,4,5,6,7,8,9],
11
scratchMe:function(){
12
console.log('ouch!');
13
}
14
}
15
16
console.log(typeofcat);
17
//object
18
19
console.log(cat.color);
20
//ginger;
21
22
console.log(cat.owner);
23
//{name:'Toby'}
24
25
console.log(cat.scratchMe);
26
//[Function:scratchMe]
27
28
//Ifafunctionisassignedasthevalueofanobject,youcancallitlikeso:
29
cat.scratchMe();
30
//ouch!
31

Arrays are objects within JavaScript

Objects have methods and properties.

index.js
1
constfavouriteFoods=['Jollof','Ravioli','Hummus'];
2
3
console.log(typeoffavouriteFoods);
4
//object
5
6
console.log(favouriteFoods.length);
7
//3
8

We know an array is an object because it has values such as Array.length

They also have methods such as Array.forEach(), Array.map(), Array.reduce(), - these are known as array iteration methods.

functions

In JavaScript, any data type which isn't a primitive is an object. This means that functions are also objects.

How is this possible?

index.js
1
//functiondeclaration
2
constmakeMe=function(){
3
console.log('makeme');
4
}
5
6
console.log(typeofmakeMe);
7
//function
8
9
console.log(typeofmakeMe.prototype);
10
//object
11
12
//arrowfunction
13
constdareMe=()=>{
14
console.log('dareme');
15
}
16
17
console.log(typeofdareMe);
18
//function
19
20
console.log(typeofdareMe.prototype);
21
//undefined
22

With our simple test above, we can see that the prototype of our function is actually an object.

We will find out about prototypes in the next section. For now, you just need to know that functions are objects, because functions inherit from the object prototype.