7 Types of Variables in JavaScript and When to Use Them

7 Types of Variables in JavaScript and When to Use Them

·

5 min read

When you are first starting out as a programmer, it can be confusing to understand exactly what data types are. After all, different languages have different names for the same things. What is even more challenging is when these data types begin to get more specific and begin to combine together.

It’s easy to get lost in an ocean of details. But do not worry! I’ll walk you through everything you need to know about variables in JavaScript as well as seven types of variables that you may come across from time to time.

What are Variables?

A variable is a name we give to data in programming so we can work with it later. You might break down a car engine or perform surgery on a human body. In programming, you break down the data and then put it back together with variables. This makes it easier to understand and manipulate the data.

You may already use variables in your daily life, like when you measure how many cups of flour you need to bake a cake. You use a variable to measure the amount of flour based on how many people will be eating the cake. You’re essentially breaking apart and then putting back together the data of how much flour is needed for a certain amount of people.

In programming, variables are used to store data like numbers, text, or images. You can also use variables to store data in groups called arrays. To use a variable, you have to first create it. You do this by giving it a name, like “cup” for the measurement of flour, and then assigning it a value. This process is called “declaring a variable”.

Data Types in JavaScript

Javascript has 7 primitive (basic) data types, these are:

  • Strings

  • Numbers

  • Booleans

  • undefined

  • null

  • Symbols

  • BigInt

There are also Objects (which includes Arrays) that I will cover another time.

Let’s break down each of the other data types on their own so you can understand what they are and when to use them.

Number Data Type

A number data type is any data that can be quantified and used to measure something. This data type is pretty self-explanatory, but it might not be as obvious when you should use it. Numbers are best when you are storing measurements or data that easily converts to numbers. This includes things like distance, time, weight, and length.

Now, you may be wondering why you have to specify that it has to be a number data type. Can’t you just store those numbers as a string data type? Unfortunately, no. If you try to store measurements as a string, you will find that the numbers will get rounded off and become inaccurate.

/** Here const is a keyword used to declare a variable. **/
/** number is the name of the variable. **/
/** 1 is the Number variable itself. **/

const number = 1;

String Data Type

A string data type is any text that is either fixed or has a set amount of characters. This data type is probably one of the most commonly used data types in programming. String data is used whenever you are storing anything related to text. This can include names, addresses, emails, phone numbers, and URLs. You may also want to use a string data type if you want to store the name of a variable or a keyword in the code itself.

/** Strings are always surrounded by double quotation marks "", 
or single quotation marks ''. **/

const word = 'string';

Boolean Data Type

A Boolean data type is a simple data type that stores a true or false value. This data type is most commonly used to store a conditional statement. In other words, you will usually use a Boolean data type to store a comparison in your code. For example, you may have a Boolean data type called "showText". Whenever a user clicks on “read more”, you can use this data type to show the rest of the text.

const showText = true;

Null Data Type

A null data type means that the data is empty or does not exist. You will commonly use this data type when you want to represent something but don’t have any information about it. For example, let’s say you are building a website and you want to store the user’s name. If the user doesn’t enter a name, then you can use a null data type to store the user’s name. This will keep your website from showing an error.

const nothing = null;

Undefined Data Type

An undefined data type means that there is no value for the variable. By default, when you declare a variable but don't set it equal to anything, then it will be assigned the value of undefined.

const notThere = undefined;

Symbol Data Type

These are values that are not equal to any other value so can be used to create unique keys for other objects. You wouldn't typically use this when just starting out with JavaScript.

const symOne = Symbol();

BigInt Data Type

A numeric type that is used to represent very large numbers which aren't possible with the number data type. You wouldn't typically use this when just starting out with JavaScript.

const bigNumber = BigInt(9007199254740991);

Conclusion

If you are new to programming, variables can be overwhelming at first. That’s okay! There is a lot to learn and remember when first starting out. The best thing you can do to get better at programming is practice. The more you practice, the more you will understand the data types and how to use them.

As you progress in your programming journey, it will become easier to identify when you should use which data type. You’ll also be able to recognise other programmers’ coding styles better.