JavaScript Variables

JavaScript Variables

Variables are a basic concept in the language. As for Javascript, you might declare variables by applying many methods. In this post, you can study and gain a deeper insight into why you have to use the Javascript variables and even how to approach them in Javascript.              

What are the variables implemented in the Javascript?

When working with code, data is information you can use for your programs. For instance, your Facebook username is called a piece of data. More programming is to stimulate or represent data. 

The developers should find a solution for storing and monitoring the data to do it. Let’s follow us to clarify it with the example below.

Initially, you need to open the Javascript console. To run the console on the Chrome browser, you can take the shortcut Ctrl + Shift + J on operating systems (Linux and Windows). You can get “Cmd + Option + J” regarding the Mac platform. 

When the console has run, suppose about the pet, like the dog’s current age (or any number if you do not own any pets), and type it in your console. 

4

Currently, what if you need to display this number again? You must type it out on another try. In this case, you have to find a good approach to involve in that data piece so you can use it again in your project. 

Variables in Javascript

A beneficial similarity is to discuss variables as labels for the values. Suppose the container of strawberries with the label is assigned strawberries. As for this case, the variable, like strawberries, targets the value that is the strawberries themselves. 

Next, you have to declare the variable: age and apply the assignment operator to set the value: 34 to this variable. In other words, you must use the var keyword like below. 

var numAge = 34

On top of it, variables are how developers bring a name to the value, so you can get it again, track it, or update it easily. Variables might be utilized for storing the Javascript type. 

At this moment, you have set this value to the variable age and might involve back to it soon. If you currently type in the variable age in the console, you can return the value: 34. 

Basic guide to using the var keyword in Javascript

Keywords of Javascript are mostly reserved words. When you start using the var keyword, you are letting the Javascript know that you will declare a variable. During using the var keyword, the variables might be assigned again. 

Next, prove it by initially declaring a new variable and name. Next, you assign it to the value: ‘Tiffdoan’. 

var fullname = 'Tiffdoan'

Afterward, you must assign this variable again to target the various name values like ‘Tiff’. 

fullname = 'Tiff'

Currently, if you start running the console.log(fullname), you might obtain the result of Tiff. When you use the var keyword, variables might even be declared without a previous value. 

var year

Next, declaring a variable ‘year’ might not point to the value. In this case, if you need to point the value to it, we will suggest that you might use the assignment operator to deal. 

year = 2022

Then, the variable year might be set to the value: 2022. When Javascript was initially made, the best solution to declare the variable was using the var keyword. 

A tip of declaring variables without using the var keyword

Variables might be declared and start without the var keyword. However, the value should be set to the variable declared without the var keyword. As usual, the variables declared without the var keyword will be the global variables. 

Besides, it is not highly suggested to declare the variable without the var keyword since it could overwrite the current variable accidentally. 

Example: 

<!DOCTYPE html>
<html>
<body>
<h2>Lesson about JavaScript Variables</h2>
<p>JavaScript Variables without var</p>
<p id="demo"></p>
<script>
function PrintMsg(){
   msgRec = "Wellcome to LearnshareIT.com"; 
}

PrintMsg();
document.getElementById("demo").innerHTML = "Message received: " + msgRec;
</script>
</body>
</html>

Output:

Message received: Wellcome to LearnshareIT.com

A scope of Javascript variables

The scope of the variable is the program’s region where it is assigned. The variables offer you double scopes like below. 

1. Local variables

A local variable might be visible only with the function in which it is assigned. Next, the function parameters are often local to this function. 

2. Global variables 

A global variable provides a global scope that demonstrates it might be assigned anywhere in the JS code. 

On top of it, from the function’s body, the local variable gets precedence over the global variable with a similar name. If you use the local variable with a similar name to the global variable, you can hide the global variable easily. 

Now, let’s see the illustrated example below. 

<!DOCTYPE html>
<html>
<body>
<h2>Lesson about JavaScript Variables</h2>
<p>Global variable vs local variable</p>
<p id="demo"></p>
<script type = "text/javascript">  
  // Declare a global variable in Javascript
  var fullname = "Tiff Doan"; 
  
  function PrintMsg() { 
     // Declare a local variable in Javascript
     var fullname = "Tiff Doan";           
     document.write("Hello ", fullname);
  }       

  PrintMsg();
</script>   
</body>
</html>

It generates the outcome below. 

Hello Tiff Doan

Variable names in Javascript

When you name the variables in JS, please conform to the rules below. 

  • You might not take any JS reserved keywords as the variable name. For instance, boolean or break variable names are invalid. 
  • Javascript variable names might not begin with the number (from 0 to 9). They have to start with the letter or the underscore character. For instance, _123test is a valid variable rather than 123test.
  • Javascript variable names are considered case-sensitive. For instance, name and Name are various double variables. 

Loosely-typed variables

Java or C# has included the typed variables. In other words, a variable will be declared with the data type, which defines the data type the variable can store. Besides, JS is a loosely typed language. 

This demonstrates that it might not ask the data type to be declared. You could assign the literal values to the variable like float, integer, string, and so on. 

let testVar = 9; // numeric
console.log("testVar: ", testVar);

// decimal
testVar = 22.9; 
console.log("testVar: ", testVar);

// Boolean
testVar = true; 
console.log("testVar: ", testVar);

// string
testVar = 'Tiff'; 
console.log("testVar: ", testVar);

// NaN
testVar = NaN;
console.log("testVar: ", testVar);

// null
testVar = null;
console.log("testVar: ", testVar);

// Hexadecimal
testVar = 0xFF;
console.log("testVar: ", testVar);

Output

testVar:  9
testVar:  22.9
testVar:  true
testVar:  Tiff
testVar:  NaN
testVar:  null
testVar:  255

Articles related to Javascript variables

Some articles related to the topic of JS Variables that you may be interested in:

Summary

That’s all about overall knowledge of Javascript variables. We are confident you can enlarge your horizon about how to approach and use the Javascript variables positively and effectively. Lastly, if you have any queries involved in it, please keep in contact with us right away. Thanks for reading.

Leave a Reply

Your email address will not be published. Required fields are marked *