Values And Types In JavaScript
Before delving into the depths of data in JavaScript, it’s important to note that all programming languages have built-in data structures.
However, these data structures often vary in each language.
In this post I’ll outline the properties of the built-in data structures in JavaScript.
Data types
JavaScript includes eight data types. Seven of these are primitive types, the eighth is the Object type.
Objects are a huge part of JavaScript that deserve an entirely different article.
Here's a brief overview of the seven primtive types:
Number
The Number type is used when you need to carry out some mathematics. It’s a double-precision 64-bit binary format IEEE 754 value, but you don’t need to worry about that for now!
Examples include:
3;
1946;
0.5;
String
When you need to work with characters, words or sentences, or print something on the screen, you’ll need to use the String type.
Examples include:
'Mario'
'apple'
'What a wonderful sentence this is.'
Boolean
Booleans are really helpful when you need your program to make a decision.
The Boolean type has just two values: true and false.
Null
The Null type has just one value: null.
It represents a lack of identification i.e. if a variable is null, it doesn’t point to any object.
Undefined
The Undefined type is used to represent a variable that has not been assigned a value.
You’ll see undefined a lot, as JavaScript automatically assigns this value to variables that have just been declared.
Symbol
Symbols are relatively new to JavaScript - they’re unique and can be used as the key of an Object property.
BigInt
The BigInt type can be used when the Number type just doesn’t cut it. It’s for huge numbers. Massive numbers.
Similar to how SQL uses FLOAT and DOUBLE, BigInt can be used to represent larger values at the cost of precision.
It’s really important to note that null and undefined are NOT the same. Null is often assigned intentionally as a representation of no value.
The seven primitive types define immutable values known as ‘primitive values’. More on this below.
Values & Types
So what’s a value and what’s a type? It can get a little blurry and it’s pretty abstract, but it helps to know these fundamentals when building and debugging applications later down the road.
Essentially, when writing a program you’ll need to express values. Depending on what you need to do with these values, you’ll need to choose different representations or types for them.
So, in programming lingo, types simply refer to how values are represented.
Immutablility
What the heck does ‘immutable’ mean?! Don’t panic.
If something is immutable, it simply means that its state can’t be changed after it’s created. That’s it. Therefore, if something is ‘mutable’, it can be changed.
So immutable means unchangeable and mutable means changeable. Got it?
To take this further, in JavaScript, primitive values can’t be changed, but objects can. So primitive types are immutable and objects are mutable.
Primitive types therefore represent data that it is not an object and has no methods.
Literals
You may have heard the term ‘literal’ used in reference to values. A literal represents a fixed value in source code.
In other words, if you include a value directly in your program code, you’re using a literal.
The easiest way to think about literals is that you’re literally writing the value in your code.
Let’s look at some examples.
string literal
We could declare a string literal like so:
var name = ‘Mario’;
String literals need to be enclosed in single (‘…’) or double (“…”) quotes. You can use either one, but choose one and stick with it throughout your program for consistency. The choice becomes more critical when you’re manipulating strings or working with JSON.
number & boolean literals
number and boolean values can also be written as literals directly within the source code:
var age = 30;
var bool = false;
typeof operator
If you’re ever unsure about the type of a value, JavaScript comes with a built-in operator called typeof.
Handily, it will return a string indicating what type you’re dealing with:
console.log(typeof ‘Mario’);
// string
console.log(typeof 30);
// number
console.log(typeof false);
// boolean
Dynamic typing
At this point it’s worth mentioning that JavaScript is a dynamic programming language. This is in contrast to a static language. This is a detailed and nuanced topic that is beyond the scope of this article, however I'll provide a very brief introduction.
JavaScript is loosely typed, whereas static languages are strictly typed.
In other words, in JavaScript, variables aren’t tied to a specific value type - they can be whatever you want them to be. They can also change type throughout a program through re-assignment.
Consider the following:
var a = 57; // a is a number
a = ‘Luigi’; // a is now a string
a = true; // a is now a boolean
JavaScript has no problem whatsoever going along with the above. The variable a is first assigned as a number, then re-assigned as a string, then to a boolean. JavaScript simply doesn’t care.
Dynamic and static typing each have their associated advantages and disadvantages. Understanding that JS is loosely typed is important in order to avoid issues and surprises later on.
This can be particularly confusing when it comes to type coercion, which I’ll break down in another article.