JavaScript variables are containers for storing data values. In other words, they hold information that can be used later in your program. There are different types of variables in JavaScript, which we'll explore in this article.
The two most common types of variables are:
- local variables
- global variables
Local variables are declared within a function, and can only be accessed within that function. Global variables are declared outside of a function, and can be accessed by any code in your program.
There are also two other less common types of JavaScript variables:
-const variables
-let variables
Const variables are like global variables, except that their value cannot be changed after they are declared. Let variables are like local variables, except that their value can be changed after they are declared.
JavaScript variables are declared with the var keyword. For example:
var x = 5;
This declares a variable x with a value of 5.
You can also declare multiple variables at once:
var x = 5, y = 10;
This declares two variables, x and y, with values of 5 and 10 respectively.
You can also declare variables without assigning them a value:
var x;
This declares a variable x, but does not give it a value.
If you try to use a variable that has not been declared, JavaScript will throw an error. For example:
console.log(x); // This will cause an error because x has not been declared
To fix this, you need to declare the variable x before using it:
var x;
console.log(x); // This will not cause an error because x has been declared
variables can be reassigned totally new values:
var x = 5;
console.log(x); // Outputs 5
x = 10;
console.log(x); // Outputs 10
JavaScript variables are case sensitive. This means that the variables myVar and myvar are two different variables.
You should also avoid using JavaScript reserved keywords as variable names. These are words that have special meaning in JavaScript, such as function, return, and while. If you use a reserved keyword as a variable name, JavaScript will throw an error.
JavaScript variables can hold any data type, including numbers, strings, objects, arrays, and even other functions.
For example:
var x = 5; // Number
var y = "5"; // String
var z = {}; // Object
var a = []; // Array
var b = function(){}; // Function
The typeof operator can be used to check the data type of a JavaScript variable. For example:
typeof x; // Returns "number"
typeof y; // Returns "string"
typeof z; // Returns "object"
typeof a; // Returns "object"
typeof b; // Returns "function"
The typeof operator is often used to check whether a JavaScript variable has a value or not. For example:
var x;
console.log(typeof x); // Returns "undefined"
If a variable has been declared, but has not been given a value, it will be undefined. So the typeof operator is a good way to check if a variable has been given a value or not.
It's also worth noting that the typeof operator will return "object" for both objects and arrays. To check if a variable is an array, you can use the Array.isArray() method:
Array.isArray(a); // Returns true
Array.isArray(z); // Returns false
JavaScript variables can be declared with or without the keyword var. For example:
var x = 5;
y = 10;
The first line declares a variable x with the keyword var, and assigns it a value of 5. The second line does not use the keyword var, and so it declares a global variable y with a value of 10.
It's generally good practice to always use the keyword var when declaring variables, so that you don't accidentally create global variables.
One final thing to note about JavaScript variables is that they are hoisted to the top of their scope. This means that you can use a variable before it has been declared. For example:
console.log(x); // Outputs undefined
var x = 5;
In the code above, the variable x is hoisted to the top of the scope, and so the console.log() statement does not cause an error. However, x is still undefined at this point. It's only when we get to the line where x is declared that it is given a value of 5.
This can be confusing, so it's generally best to avoid using variables before they are declared.
JavaScript also has two other keywords for declaring variables: const and let.
const variables are like global variables, except that their value cannot be changed after they are declared. For example:
const x = 5;
console.log(x); // Outputs 5
x = 10; // JavaScript will throw an error because you cannot reassign a const variable
let variables are like var variables, except that their value can only be accessed within the block they were declared in. For example:
if (true) {
let x = 5;
console.log(x); // Outputs 5
}
console.log(x); // JavaScript will throw an error because x is not accessible here
As you can see, the value of x can only be accessed within the if block. This is because it was declared with the keyword let.
JavaScript also has a special keyword, called this. this is a reference to the current context of the code. For example:
function foo() {
console.log(this); // Outputs the global object (window in a browser)
}
When used inside a JavaScript function, this refers to the global object. In a browser, this is the window object.
You can also use this to refer to an object's properties and methods. For example:
var person = {
firstName: "John",
lastName: "Doe",
fullName: function() {
console.log(this.firstName + " " + this.lastName);
}
};
person.fullName(); // Outputs "John Doe"
As you can see, this refers to the person object, and so it has access to the firstName and lastName properties. It also has access to the fullName() method, which outputs the person's full name.
You can also use this to refer to the current context of an event handler. For example:
<button onclick="console.log(this)">Click me</button>
When the button is clicked, this will output the button element that was clicked.
So that's a brief overview of JavaScript variables and how they work.
