const - JS | lectureJavaScript Fundamentals 1

In the previous lecture, we talked about values and variables; one thing to note is that values can have different types in every programming language depending on the type of data we want them to hold. In lectures one and two, we saw Strings and Numbers; but there are more data types. Let's talk about all the data types we have in JavaScript.

In JavaScript, every value is either an Object or a Primitive.

// Object
let student = {
  firstName: 'Ulrich',
};

// Primitive
let firstName = 'Ulrich';
let quantity = 24;

Don't worry about objects, for now. We will talk about them later. For now, let's focus on primitive data types.

There exist seven primitive data types in JavaScript :

1. Number
2. String
3. Boolean
4. Undefined
5. Null
6. Symbol
7. BigInt

Let's study them one by one.

1. Number: Numbers are always so-called floating-point numbers, meaning they always have decimals even if we don't see or define them. For example, if we declare a variable say, let age = 23, it is exactly like having 23.0, but they are both simply the number data type. In many programming languages, you will find different data types for integers and decimals; but that's not the case for JavaScript. In JavaScript, all numbers are simply of the type number.

2. String: Strings are a sequence of characters, mainly used for text. You should always place them in quotes; let it be single or double quotes, else JavaScript won't make the difference with variables.

3. Boolean: This data type is essentially a logical type that can only take one of the logical values, .i.e. true or false. They are generally useful when making decisions with code, as we are going to see later.

4. Undefined: It is the value taken by a variable that is not yet defined. A variable that has not been defined is simply a variable that has been declared but has not been assigned a variable. Example: let age;

5. Null: Pretty similar to undefined because it also means empty value, but used in different circumstances. Don't worry for now; just know it exist.

6. Symbol: It was introduced in ES2015. It simply defines a variable that is unique and cannot be changed.

7. BigInt: It was introduced in ES2020. It is used for integers that are too large to be represented by the number type.

There is another fundamental thing to know about types. Remember what I said in lecture one about JavaScript being dynamically typed? It simply means that when you create a new variable, you do not have to manually define that data type of the value that it contains. This is the case for many programming languages. Instead, JavaScript automatically determines the data type of the value which is stored in the variable.

The distinction between value and variable is important because, in JavaScript, it is the value that has a type, not the variable. To make it simple, variables store values that have a type.

Another application of dynamic typing is that we can assign a new value with a different data type to the same variable without a problem. For example, let's consider a variable year which is initially a number. We can then assign a string to this variable, which is no problem in JavaScript. It can be useful but can also be the source of some troubles when it comes to finding bugs in our code.

Before we get into action with data types, let's quickly talk about code commenting.

In programming, we use comments to comment our code or to deactivate code without deleting it. There are two types of comments : Single line comments and Multi-line comments

To make a single-line comment, add two forward slashes ( // ) in front of any line of code.

// Comment to descibe my variables...let myCurrentJob = 'Software Engineer';
let myCurrentCity = 'Paris';

JavaScript will completely ignore everything that is a comment ( Anything that comes after // ). It can be very useful to divide our code into different sections and explain what different code pieces are doing.

Another use case of comments is deactivating a line or multiple lines of code we don't want to be evaluated and don't want to delete. To do it, comment it out like this :

let myCurrentJob = 'Software Engineer';
let myCurrentCity = 'Paris';
console.log(myCurrentJob);
//console.log(myCurrentCity)

The highlighted line will be ignored by JavaScript because it is now a comment and the value will not be shown in the browser console.

To add a multi-line comment, you add a forward slash, then an asterisk. You then close it by adding another asterisk and then a forward slash ( /**/ ). Everything present between the two asterisk, will be a comment and will be ignored by JavaScript.

let age = 10;
/* let myCurrentJob = 'Software Engineer';let myCurrentCity = 'Paris';console.log(myCurrentJob)console.log(myCurrentCity) */console.log(age);

Let's come back to data types. In the previous lectures, we saw strings and numbers, so nothing new to that. Let's move on to booleans. As said previously, a boolean is a value that can only be true or false.

let javascriptIsMyFavourite = true
console.log(javascriptIsMyFavourite) // Result ==> true

The typeof operator

The typeof operator, just like the plus or minus operator, is an operator that we can use to show the type of a value.

let fifaIsFun = true

console.log(typeof true) // Result ==> boolean
console.log(typeof fifaIsFun) // Result ==> boolean
console.log(typeof 'Software Engineer') // Result ==> string
console.log(typeof 32) // Result ==> number

The result of using this operator on a value will be a new value which is a string with the type of the value we are trying to evaluate .i.e. true.

Dynamic typing in action

Remember that dynamic typing means we can easily change the value type that is held by a variable. Consider the snippet below :

let fifaIsFun = true
fifaIsFun = 'Yeah it is!'

What matters here is that we do not write the let again on the highlighted line. We only do that the first time we declare a new variable. Then, when we want to change the variable's value, we write the variable's name without the let keyword and assign the new value.

Using the basket analogy as we did in lecture two, it's like initially, we had bread in our basket, then taking the bread out of the basket and instead placing an apple in the basket.

If you now try to check the type of the variable fifaIsFun using the typeof operator, you should get string.

let fifaIsFun = true
console.log(typeof fifaIsFun)// Result ==> booleanfifaIsFun = 'Yeah it is!'
console.log(typeof fifaIsFun)// Result ==> string

Undefined data type

Remember that undefined is the value taken by a variable that is not yet defined. To make it short, undefined means an empty value. In JavaScript, it is perfectly legal to do this :

// Defining a variable without a value
let myCurrentJob;
console.log(myCurrentJob) // Result ==> undefined
console.log(typeof myCurrentJob) // Result ==> undefined

You will notice that you get undefined in both logs. This means that whenever we declare an empty variable, the variable's value will be undefined, and the type of the variable is also undefined.

What you can then do like with any other variable is to reassign a value to an undefined variable :

// Defining a variable without a value
let myCurrentJob;
console.log(myCurrentJob) // Result ==> undefined
console.log(typeof myCurrentJob) // Result ==> undefined

/*
Without the let! Because we are just reassigning a new value
not creating a new variable.
*/
myCurrentJob = 'Software Engineer'
console.log(typeof myCurrentJob) // Result ==> string

As you may have guessed, after reassigning a new value to our variable, the new type of our variable is now a string. This clearly shows the effect of dynamic typing.

To conclude this lecture, I will like to show you an error in the typeof operator.

console.log(typeof null) // Result ==> object

Remember that null is just another data type that is similar to undefined. They are also similar in the fact that both the value and the type of the value are null. About this error, JavaScript says that the type of null is an object and that doesn't make sense at all. This is actually regarded as a bug or an error in the JavaScript language. This bug has never been corrected for legacy reasons, but now it's, of course, not an object. It should return null just as type of undefined returns undefined.