Javascript Variables and Data Types

In this lesson we'll learn how to declare variables in JavaScript & explore the available data types. We'll also learn about Dynamic typing & address common pitfalls with data types

DevHoot

Info:

Download the slides at : https://docs.google.com/presentation/…

JavaScript Overview: https://youtu.be/S2o7mW6GKPg

JavaScript Objects: https://youtu.be/ZF4Z5kL1ePY

Transcripts:

Welcome to a new lesson in JavaScript at devhoot in this lesson we are going to study about variables and data types in JavaScript will see how to declare variables in JavaScript we’ll go over the concept of dynamic typing in JavaScript and then we’ll explore all the available data types in JavaScript. If you are completely new to JavaScript and want to get an overview of it I recommend going through my other lesson in which I explain what JavaScript is and how it works.

In that lesson I gave an overview of the background of JavaScript, the link to that lesson is in the description. If you feel you are ready to move on with this lesson then hang tight as we are going to explore everything about variables and datatypes. In most of the programming languages variables are provided with the primary purpose of storing data. Variables are basically named storage spaces in these storage spaces we can store any data that we want and then using the names we can reuse this data at any point in the program, and as it stands that javascript can do this too, if it couldn’t then JavaScript would be pretty much useless so the point to note here is that variables mean space, they provide you space with the name, the manner in which we declare variables in JavaScript is with the use of the VAR keyword.

First we give the VAR keyword then a space and then we give the name that we want the storage space to have, in this case I have given the name soda so the storage space has the name soda and the value that will be stored inside of soda is given after the equal to sign. Here I have given the values strong which is inside of double quotes anything stored inside of double quotes or single quotes in JavaScript indicates that it is a string and string means that it will be treated as text so strong is treated as text which is stored inside of soda variable. Now one thing is that you can name your variables anything you want but a good practice and common convention is that while aiming your variables you should always keep give names that are self descriptive that is name should define the purpose of the variable for example if I’m storing the name of a person the best name for the variable will be person or name. In this way any other developer who reads your code can identify for the purpose of the variables are and also it reduces commenting on your part as a developer. Now note that in JavaScript the value that we can store inside of variables can be anything it can be numbers or any other type of data, now we’ll come back to datatypes at a later stage in this lesson but for now one thing you need to remember is that a variable has two parts a name and a value the name is the name of the storage space and the value is the value which is stored inside of that storage space and the manner in which you declare a storage space is by using the VAR keyword.

Now while making a variable in JavaScript there are two parts declaration and initialization so giving a name to a storage space is known as declaration and assigning an initial value to a variable is known as initialization, now these two processes declaration and initialization can be done separately or together for example here in this code snippet we have done both of them together note that we have declared the name of the sole space with var name and together with doing the declaration we have also given an initial value of a string which reads Imran to the name variable these two processes can be done separately also for example here we have declared the var name and then after the declaration at a later point we are giving it a value of imran by just typing name equals to imran encodes. The value we give to this variables are not permanent that is we can change this values whenever we want an example of it is that see we have made two variables who are named given it a value of Imran at a later stage and the second variable age in which the declaration and initialization burden at the same time while H equals 18 now notice that here we haven’t used any quotes this means that 18 will be stored inside of age as a number so now age and name our variables which have some values at a later stage we need to change these values so we can just do exactly in the manner in which we assign values name equals to soda give it another name and H equals to 20 change the age which was a number. So I’m in my browsers console and now I am going to show you the concepts that we just learned so first let’s declare a name now we are going to do separate declaration and initialization for this name variable now let’s give name a value name of indras and now let’s do declaration and initialization together for the age.

Now let’s change the values that these two variables head until the console acknowledges our change that is now the name have value of table now let’s change the age variable it’s 20 and here so it works perfectly fine Bravo now you know how to declare variables in JavaScript and also know what declaration and initialization means and also when to do what I’ve shown you only one method to declare variables in JavaScript that is with the help of the VAR keyword de var keyword is the oldest method of creating variables in JavaScript the new standards of JavaScript recently introduced two new keywords let and Const with the help of these two new keywords we can declare variables in JavaScript but let’s reserve these two keywords for a later stage because when we declare variables with these two keywords then the meaning changes the entire context in which we use those variables changes so we’ll explore all these details about these two keywords in a separate lesson but I thought it would be good for you to know about this now as the primary function of these two keywords is also to declare variables, so now you know about this let’s move on having learned to declare variables now let’s learn about data types in JavaScript before learning data types in JavaScript there is one concept you should know about dynamic typing. If you don’t know there are two types of programming languages dynamically type programming languages are loosely typed programming languages and the another group is statically typed programming languages known as strongly typed programming languages the example of strongly typed programming languages are C++ C Java etc and the examples of dynamically typed programming languages are JavaScript Python now what does dynamic typing means in programming languages such as C C++ and Java when declare variables we also associate a type of those variables for example when we want to have a variable which will store a number we declare that variable as an integer with the keyword of int similarly if we want to declare a variable which will store strings then we declare it with this string giver that means on declaration we associate types to those variables and these variables can only hold values of these and these types only that is say for example if I declared variable as an integer then that variable cannot hold a string that variable will always and always be only able to hold integral values in JavaScript and Python.

Concepts doesn’t hold in JavaScript dynamic typing comes into play this means that a programmer doesn’t have to specify the types of variables that he declares the JavaScript engine at runtime enforced the type of the variables on the basis of the value stored in them for example in the previous examples that we took for example the name variable then in the name variable we gave a value which was inside of quotes and we declared the name variable using the plain old var Kiva so how will JavaScript come to know what was the type and how will the programmer indicate the JavaScript engine that the type was of strength the answer is that the programmer won’t the programmer will just give the value that he wants to give to a variable and the JavaScript engine understands it so when we give a string value so when we give the value of Imran inside of quotes to the name variable the JavaScript engine automatically inferred that it was a strength similarly if we type a number than the JavaScript engine infers that it was a number and also we can hold any type of value in a variable at any point of time in a program say at a later stage if inside of Imran I assign numerical value then it’s totally valid in JavaScript this is the concept of dynamic typing at its bare basics so it was crucial for you to have the knowledge of this concept if you want to work with JavaScript and now that you have an understanding of it let’s move on and export the datatypes available in java screen okay so before that we’ll see an example of dynamic typing here we have a variable var foo which has a value of a number double-oh-seven now see your foo is a number at a later stage we can reassign food to another value which may be of another type in this case we have assigned a string which has a value of inside of foo so who is now a boolean now this is the concept of dynamic typing.

Let’s move on the ACMA script standard they find that there are six primitive datatypes in java script and those are namely boolean number string null undefined and symbol there is another non primitive datatype the object now if we are going to see each of this types in detail a boolean represents two values true and false boolean variables are used in scenarios when we need to examine whether something is true or false for example say we have an e-commerce application inside of that we give each product a boolean variable say in cart now in cart is a boolean variable which can be the true or false and if in cart is true this means that the item is in the cart if it’s false it means that the item is an IndyCar so we can use boolean variables to check whether certain condition is true or false and accordingly take some action in our application or program it’s like an on and off switch it can have only two states the manner in which we make a boolean variable in JavaScript is similarly to making any other variable in JavaScript that is with the VAR keyword var and then giving the name of the variable then giving the equal to symbol and then assigning the value which can be the true or false now one thing to note here is that true or false are without any codes now as a beginner you might give true and false inside of quotes double quotes or single quotes now this is a common pitfall for newcomers always remember that JavaScript is a dynamically typed language and this is why I introduced the concept before introducing data types in JavaScript this is because if you if you take the same variables that you took earlier and assign the value of true or false but inside of quotes then those two are false will not be assigned as boolean but as strings so the variables that you intended to be boolean and it a pink strings so this will break your entire program as you try to do some things that will be intended for boolean variables but things will result in an error because those boolean variables will be strings so with that in mind let’s move forward.

The second data type we are going to focus on is number now numbers are the basic thing that we ever need in a program because the history of computing relates back to calculating with numbers its inherent that all programming languages have specifications and methods to deal with numbers now in JavaScript there is only one datatype for all kinds of numbers which is number kind of number whether a fraction or a whole number is treated as a number whereas in other strongly typed languages there are a lot of different types of numbers define and all of them havem different types of data types for example in C and C++ the numbers which don’t have any fractional part are defined with the data type of int which says that they are an integer and floating point variables have the datatype of float and high precision floating point numbers as the data type of doubles in JavaScript all numbers have the data type of number.

Subscribe below or here to receive new content whenever I publish. 👇

No new content, No new e-mail. Promise !!!