Welcome back to our series of JavaScript tutorials. Now that you have created your first interactive web page, it’s time to get a little deeper into the basics of JavaScript. Today we’re going to talk about variables and data types. Knowing about these will help you to better control and manipulate your data in scripts.
What are Variables?
In programming, a variable is like a storage box where you store different types of data. Variables allow you to keep pieces of information, such as numbers, text, or even more complex data, to use and access later in your program. Declaring a variable in JavaScript is pretty simple.
Declaring Variables
JavaScript has three kinds of declaring a variable using the var, let, and const keywords. Here’s how you use each:
var: Declares a variable, optionally initializing it to a value.
let: Like var, but with some extra rules to better control how the values are accessed.
const: Declares a variable whose value cannot be changed, use const for all variables that do not need to be reassigned.
Here is how you declare variables:
var name = 'Alice'; // Older way, still seen in older code
let age = 25; // Preferred for variables that might change
const birthYear = 1995; // Use const when the value should not change
Data Types in JavaScript
Variables in JavaScript can contain a lot of data types, including numbers, strings and objects and more. It is very important to know what type your variable holds. Here are the most common data types in JavaScript:
Primitive Data Types
String: May contain a sequence of characters, such as ‘hello’. You can use quotes or double quotes.
Number: May contain both integer and fraction. For example: 42 or 3.14.
Boolean: Can have one of two values: true or false.
Undefined: A variable Declaration using a declaration statement. Under which no assignment or only undeclared variables occur.
Null: The undefined or unintentional non-existence of any object value.
Non-primitive Data Types
Object: All the instances of classes, arrays and complex data structure comes under object.
Array: A special type of object used to store sequences of values.
Fast.generator {quick example to be done}
let message = "Hello, world!"; // String
let count = 150; // Number
let isActive = true; // Boolean
let user = null; // Null
let und; // Undefined (implicitly set)
Working with Variables and Data Types
Let’s extend your current index.html from the previous tutorial to actually see variables and data types in action.
Update your html file: add a script section or update the existing one.
Add Js code : Below content inside of your script tag:
<script>
let userName = 'John Doe';
const birthYear = 1990;
let currentYear = 2023;
let age = currentYear - birthYear;
console.log('Hello, ' + userName + '! You are ' + age + ' years old.');
</script>
In this script:
We calculate the age by subtracting the birthYear from currentYear.
We use the console.log() function to print a message in the browser’s console.
Viewing the Output
To view the output of this script:
Open your index.html in a web browser.
Open the browser’s developer tools. This is usually done by pressing F12. It can also be accessed by right-clicking and selecting “Inspect”.
Go to the “Console” tab where you should see the message printed.
Conclusion
Var payableAmount AZN 450 Variables and data types form a basis in learning JavaScript. It is these building blocks that permit a dynamic treatment of your web applications’ data. Indeed, as you progress through these tutorials you will start to see how these basics are transformed to apply to more challenging programming tasks. Continue with the practice and see you in the next lesson!