Data and Structure Types in Javascript | Learn Basics of Javascript

We are going to take a look at something very basic before galloping on the learning horse. What are the Data and Structure Types in Javascript? Since it is something that we would need every step of the way to learning Javascript. Let’s get on with it, shall we?

As per the latest ECMAScript, there are around nine different Data and Structure Types combined in Javascript. Let’s take a look at what are they:

Primitive Data Types

There are six data types in Javascript. These are all primitive:

1. undefined – When you don’t define a variable, it becomes undefined. This can be created voluntarily too. I have covered it down below.
2. Number – It is a numeric data type of the format double-precision 64-bit floating point. (numbers between -(2⁵³ − 1) and 2⁵³ − 1). We will see some examples later on this tutorial.
3. Boolean – It always remain the same – true or false in almost every language since it decides the foundation of a computer i.e. binary. Things are either 1 or 0.
4. String – String is nothing but a sequence of characters to represent text. You can type literally any text you want if placed in a single or double inverted commas, and it will be treated as a String. When it becomes an object it is treated as a wrapper.
5. BigInt – It is another numeric data type of the format arbitrary precision. In some cases where memory concerns are entailed we make use of BigInt.
6. Symbol – Symbols were introduced in ECMAScript 2015. In order to make a symbol value you need to call the Symbol function. It basically assigns and allocates a dynamic anonmyous value to the symbol.

If you are not sure what type of data type a particular item is you can always use ‘typeOf‘ operator. A live example of how to do that, we will see at a later point.

Structural Data Types

There are two main types of structural data types namely:

1. Object – Object is nothing but a data structure containing data. You can use that data to perform different actions. etc. Javascript can be called an Object-Oriented Language on how it adheres to the concept of objects.
2. Function – Function is similar to the concept of methods in Java. It is a code snippet you can use to call other functions or itself, or even a variable. You pass arguments into it, do some stuff and can choose to get a value in return.

NOTE: In order to check what type of object we are using, you can use instanceOf operator. We will see its example in a separate tutorial.

Structural Root

The last data type which is a primitive once again is:

Null: Null basically assigns to something that doesn’t point to any object or address. When you are getting null that means you are trying to get non-existent stuff. Also if an object is not inherited, it gives this output.

Remember, every object is derived from null just like the speculation of how our universe too derived from a black hole.

The theory part of the tutorial was inevitable. Now let’s jump into the fun part. We will learn how to define a variable first, and hopefully do some coding too.

Javascript Data and Structure Types – Defining a Variable

You can either use var or let to define a variable in Javascript. ‘Let’ was introduced at a later stage in 2015 (ES6) version of Javascript. We will get into the detail of ‘let’ at a later point.

So both

let x = "Ram" 

or

var x = "Ram" 

basically does the same thing.

If you don’t define a variable, for e.g. like this:

var x;

It means that x is undefined. You can explicitly define a variable to undefined too, like this:

var x = undefined;

Defining a Constant

If you want to define a constant meaning something whose value you don’t want to change, you gotta define it using the keyword const.

const x = 5;

will assign 5 to x. You cannot change the value of x throughout a scope now. Doing

const y = "Bhole";

will assign “Bhole” string to y, and it will remain so throughout the scope.

Javascript is a Dynamic Language – Data Types and Structure

Javascript is a loosely typed language or a dynamic language. This means you can assign any particular data type to a variable, and it would be treated based on the data type your Javascript identifies.

So if you say:

var x = 4;

It is treated as an integer. If you say

var x = “Ram”;

x becomes a string, and so on.

Implicit Type Coercion – Working with Numbers and String

When you add a number and string in Javascript, it will be treated as a String.

let v = "Ram" + 16;

If you console log v, you get:

Ram16

The opposite unfortunately would also be true in this case. So the opposite meaning:

let v = 16 + "Ram";

would give you:

16Ram

Talking about sequencing and expressions, JavaScript basically evaluates expressions from left to right. So if you are writing:

let v = "Ram" + 16 + 5;

You try to console log v and you get:

Ram165

So the whole treatment you got here was that of a String.

However, when you do the opposite i.e.

let v = 16 + 5 +"Ram";

This time since the evaluation starts from left to right, 16 + 5 will be done first which is 21. So the answer you get is:

21Ram

Got it?

Other Important Things to Remember in Javascript Data and Structure Types

You can define a number as decimal as well. For e.g.

let x = 5.43;

and it will assign 5.43 to x.

You can also define big numbers using exponents like this:

let z = 235e5; 

The above means 2,35,00,000.

String can be defined in a single or double inverted comma. So both:

let v = ‘Ram’;

and

let v = “Ram”;

are correct.

Arrays in Javascript

Defining an array is almost very similar in every programming language.

You can simply use Array[number] where replace the number with the number of indices you wish to use.

So for e.g.

let age = Array[5];           //only declares the array with size

This will declare a variable called age assigning five boxes to it.

Now you gotta define it as well.

Let’s create a new object of this array using the new constructor.

age = new Array(13,36,67,34,76);    //array defined with new object

There now you have age defined with 5 different values in each index.

You can now print the value to display the array. You will get the result as:

[ 13, 36, 67, 34, 76 ]

But wouldn’t it be more convenient if we did it in just one step?

Yes so alternatively, you can define it using square brackets or [ ].

You declare and define it at the same time in Javascript more conveniently like this:

let x = ["Kid", "Man", "Woman"];

Just like the concept of an array, the first item is [0] second is [1] and so on. So here first item is Kid. Second is Man and third item is Woman.

In order to push something to an array you use:

x.push("Boy");

and if you console.log x. You will notice that the new output is:

["Kid", "Man", "Woman", "Boy"]

A more in-depth practical example tutorial on Array is available here for you.

Objects

Objects in Javascript are placed inside curly brackets or { }.

Properties of an object are written in a name:value kind of setup. So for example:

let obj = {man: “Ram”, woman: “Sita”};

So the above example has two properties – man and woman.

If you console log – man, you do it like this:

console.log(obj.man);

The above will you give you the output:

Ram

Similarly, you can print what woman name has using obj.woman in the above example.

That’s all there is to learn in Data and Structure Types in Javascript.

This concludes this chapter. Hope you liked it. Stay tuned for more lessons. They are coming soon.