The purpose of this tutorial is to provide you with a clear understanding of variables in HTML and related scripting languages. Variables are fundamental to many programming languages, they are like containers that hold data which can be manipulated and used throughout your code. By the end of this tutorial, you will understand how to declare, assign, and use variables.
Prerequisites: Basic knowledge of HTML and JavaScript. If you're not familiar with these, I recommend learning HTML and JavaScript basics before proceeding with this tutorial.
A variable is a named space in the memory, which stores a value. The value can be of various types like number, string, array, object, etc. Variables are used to store data, which can be used throughout your code.
In JavaScript, you declare a variable using the var
, let
, or const
keyword. The var
keyword is used in older versions of JavaScript, while let
and const
are newer additions.
Example:
var name; // Declares a variable named "name"
let age; // Declares a variable named "age"
const height; // Declares a constant variable named "height"
After declaring variables, you can assign values to them. This is done using the assignment operator =
.
Example:
var name = "John"; // Assigns the string "John" to the variable "name"
let age = 30; // Assigns the number 30 to the variable "age"
const height = 180; // Assigns the number 180 to the constant "height"
Let's look at some examples.
// Declare a variable
var name;
// Assign a value to the variable
name = "John Doe";
// Use the variable
document.write(name); // This will write "John Doe" on your webpage
In this example, we first declare a variable name
. We then assign the value "John Doe"
to name
. Finally, we use document.write(name)
to write the value of name
on our webpage.
Here's another example:
// Declare and assign a variable in one line
let age = 25;
// Use the variable
document.write(age); // This will write "25" on your webpage
In this example, we declare a variable age
and assign a value to it in the same line. We then write the value of age
on our webpage.
In this tutorial, you've learned how to declare, assign, and use variables in your code. You've also seen how variables can be used to store different types of data. The next step in your learning journey would be to learn about different data types and how to manipulate them. You can also start learning about functions, which allow you to group code into reusable chunks.
color
and assign it the value "blue"
. Then use document.write()
to write the value of color
on your webpage.number
and assign it the value 10
. Then, reassign number
the value 20
. Write the value of number
on your webpage.Solutions
// Declare and assign a variable
let color = "blue";
// Use the variable
document.write(color); // This will write "blue" on your webpage
// Declare and assign a variable
let number = 10;
// Reassign the variable
number = 20;
// Use the variable
document.write(number); // This will write "20" on your webpage