Hello and welcome to Day 4 of our back-end journey! 🎉

In yesterday's lesson, we learned about the basics of JavaScript and how to write our first lines of code. Today, we'll be diving a bit deeper into the language and exploring some of its key concepts: variables, data types, operators, and type coercion.

By the end of this lesson, you'll have a solid understanding of how to work with these concepts in JavaScript, as well as how to use them to write more complex and powerful code. So let's get started! 💪

Variables in JavaScript

Basically, the JavaScript syntax defines two types of values:

• Fixed values

• Variable values

Fixed values are called Literals.

Variable values are called Variables.

💡 Why are variables needed?

Variables are a fundamental part of programming languages, and they serve several important purposes. First and foremost, variables allow us to store data that can be accessed and modified throughout our programs. Variables are like storage boxes in a kitchen. Just like you would use a storage box to store different kinds of food in your kitchen, you can use variables to store different types of data in your code. This is useful because it enables us to write code that is more dynamic and flexible, as we can change the values of variables based on different conditions or user input.

What are variables?

In JavaScript, variables are named storage locations that hold a value. The value can be of any data type, such as a number, a string, or an object.

🔢 Types of variables in JavaScript

In JavaScript, there are three ways to declare variables: var, let, and const. These keywords determine the scope and mutability of the variable.

Before understanding the var, let, and const.. It is important to understand what scope and mutability is -

A mutable variable is a variable whose value can be changed or modified after it has been assigned. An immutable variable, on the other hand, is a variable whose value cannot be changed or modified after it has been assigned.

Scope in JavaScript

In programming, scope refers to the visibility and accessibility of a variable within a certain part of a program. There are three types of scope in JavaScript: global, function, and block.

• Global scope: A variable with global scope is accessible from anywhere in the program.

• Function scope: A variable with function scope is only accessible within the function in which it is defined.

• Block scope: A variable with block scope is only accessible within the block of code in which it is defined (e.g., within curly braces {}).

var, let, and const

• var: Variables declared with the var keyword are globally scoped or function scoped. This means that they can be accessed from anywhere within the current scope (either the global scope or the function scope).

• let: Variables declared with the let keyword are block scoped. This means that they can only be accessed within the block of code in which they are defined.

• const: Variables declared with the const keyword are also block scoped, but their values cannot be reassigned.

// Declare a global variable `x` using `var`
var x = "global";

// Declare a block-scoped variable `y` using `let`
let y = "block";

// Declare a constant `z` using `const`
const z = "constant";

console.log(x); // Output: "global"
console.log(y); // Output: "block"
console.log(z); // Output: "constant"

// Reassign the value of `y`
y = "reassigned";
console.log(y); // Output: "reassigned"

// Attempt to reassign the value of `z`
z = "reassigned"; // Throws a TypeError: Assignment to constant variable.

You will develop an understanding of the Functional scope and the block scope once you will learn about the conditional statements, the functions and about the objects.

📋 Here is a comparison of the different variable declarations:

💡 When declaring variables, it's a good practice to use let or const instead of var, as they offer better control over the variable's scope and mutability.

Naming the Variables

JavaScript is a case-sensitive language, which means that the variables firstName and FIRSTNAME are treated as two different variables. It's important to choose descriptive and meaningful names for your variables to make your code easier to read and understand.

for example,

let firstName = "John";
let FIRSTNAME = "Jane";

console.log(firstName); // Output: "John"
console.log(FIRSTNAME); // Output: "Jane"

JavaScript and Camel Case

Camel case is a naming convention in which the first word is in lowercase and subsequent words are capitalized. For example:

let firstName = Vaibhav
let lastName = Dewangan

Commenting in JavaScript

Comments in JavaScript are like little notes you can leave for yourself or other developers to help explain what's going on in the code. They're completely ignored by the interpreter, so they don't affect how the code runs. They're just there to help make sense of things.

There are two main types of comments in JavaScript:

• single-line

• multi-line Single-line comments are created using two forward slashes (//) followed by the comment text, and they apply to the rest of the line. For example:

// This is a single-line comment

Multi-line comments, on the other hand, are created using /* and */ to enclose the comment text. They can span multiple lines and are great for leaving longer notes or explanations. For example:

/*
This is a
multi-line comment
*/

Comments are super useful for helping you or other developers understand what's going on in your code. They're especially helpful in large code bases or when working on a team. Just don't go crazy with them – too many comments can make your code look cluttered and hard to read.

So next time you're working on a piece of code and you need to leave yourself a little reminder or explanation, don't be afraid to use a comment! It'll save you a lot of head-scratching later on.

Data Types in JavaScript

Now you have understood the variable. Variables are used to store values of different types, and the kind of value that a variable can store is determined by the data type of the variable.

Data types are an important concept in any programming language, as they determine the kind of values that a piece of code can work with.

In JavaScript, there are two main categories of data types:

• Primitive Data types

• Complex Data Types

Primitive data types

Primitive data types are the most basic data types and include strings, numbers, booleans, null, and undefined. These data types are immutable, meaning that their values cannot be changed once they are assigned.

• Strings: Strings are sequences of characters, and they can be represented using single or double quotes. For example: 'Hello World' or "Hello World".

• Numbers: Numbers can be either integers (whole numbers) or floating-point numbers (decimals). For example: 42 or 3.14.

• Booleans: Booleans represent true or false values. They are often used in conditional statements to control the flow of a program. For example: true or false.

• Null: The null value represents an empty or null reference, and it is written as null.

• Undefined: The undefined value represents a variable that has not been assigned a value, and it is written as undefined.

Complex data types

Complex data types are more advanced data types that can contain multiple values or collections of data. The two main complex data types in JavaScript are objects and arrays.

• Objects: Objects are collections of key-value pairs and are used to store complex data. They are written using curly braces, with the keys and values separated by a colon. For example: {name: 'John', age: 30}. Objects can contain any data type, including other objects and arrays.

• Arrays: Arrays are ordered lists of values, and they are written using square brackets. For example: [1, 2, 3]. Arrays can contain any data type, including other objects and arrays.

It's important to understand the different data types in JavaScript, as they determine how your code will behave and what operations can be performed on the data.

💡 Dynamic typing in JavaScript

One of the unique features of JavaScript is its dynamic typing, which means that the data type of a variable can change at runtime. In other languages, such as C, you have to specify the data type of a variable when you declare it, and you cannot change it later. In JavaScript, however, you do not have to specify the data type of a variable, and you can change it freely.

For example, you can declare a variable x and assign it a number value:

let x = 10;

Later on, you can reassign x to a string value:

x = "hello";

This flexibility allows us to write more dynamic and flexible code, but it can also make our programs more prone to errors if we are not careful. It's important to understand the data types of our variables and how they will be used in our code.

Conclusion

To conclude, variables and data types are important concepts in JavaScript that enable us to store and manipulate data in our programs. It is important to understand the different types of variables and their scope and mutability in order to write effective and efficient code

In our next blogs, we'll be diving deeper into JavaScript as we explore two key concepts: operators and type coercion. 🤓

Thank you for following our blog and for your continued support. If you enjoyed this lesson, please consider leaving a comment and sharing our blog with others. We appreciate your feedback and support as we continue on this journey together. 🙏

Don't forget to keep following us for more interesting and informative content. 🚀

Thanks for being a part of our journey! 🎉