Master JavaScript From Basics to Advanced Programming Skills.

Explore the fundamentals and advanced concepts of JavaScript with our comprehensive and hands-on online course for web development mastery.

Strat Your Test Now Dear learners, Are you interested in assessing your progress? Request your mentor to give you access and start your Test.

“Explore the fundamentals of JavaScript programming with our comprehensive course. Learn to create interactive web applications, manipulate the DOM, and master essential JavaScript concepts for dynamic development.”

Learn More About JS

1.  Conditional Statements (if , else , else-if ) :

  • The if statement checks if the age variable is less than 18. If true, it prints “You are a minor.”

  • The else if statement checks if the age is between 18 (inclusive) and 65 (exclusive). If true, it prints “You are an adult.”

  • If none of the above conditions are met, the else statement executes and prints “You are a senior citizen.”

HTML

let age = 25;

if (age < 18) {
    console.log("You are a minor.");
} else if (age >= 18 && age < 65) {
    console.log("You are an adult.");
} else {
    console.log("You are a senior citizen.");
}

OUTPUT

You are an adult.

2. The for loop:

 the for loop is a control flow statement that allows you to repeatedly execute a block of code based on a condition.

  • initialization: This part is executed once before the loop starts. It typically initializes a counter variable.

  • condition: The loop continues executing as long as this condition is true.

  • increment/decrement: This part is executed after each iteration of the loop. It usually increments or decrements the counter variable

  • let i = 1; initializes a counter variable i with the value 1.
  • i <= 5; is the condition. The loop will continue as long as i is less than or equal to 5.
  • i++ increments the value of i after each iteration.

HTML

for (let i = 1; i <= 5; i++) {
    console.log(i);
}

 

OUTPUT

1
2
3
4
5
While &  do while loop :
  • while loop:
    The while loop repeatedly executes a block of code as long as a specified condition is true.
  • do-while loop:
    The do-while loop is similar to the while loop, but it ensures that the block of code is executed at least once, even if the condition is initially false.

HTML

let i = 1; while (i <= 5) { console.log(i); i++; }

let i = 1; do { console.log(i); i++; } while (i <= 5);

OUTPUT

 1
2
3
4
5
for in loop :
  •  the for...in loop is used to iterate over the properties of an object. It works with enumerable properties and is often used for looping through the keys (property names) of an object.
  • variable: A variable that will be assigned the key (property name) during each iteration.
  • object: The object whose enumerable properties will be iterated.

HTML

let person = {
    name: "John",
    age: 30,
    isStudent: false
};

for (let key in person) {
    console.log(key + ": " + person[key]);
}

OUTPUT

name: John
age: 30
isStudent: false
for of loop:
  • The for...of loop in JavaScript is used to iterate over the values of an iterable object, such as an array or a string. It provides a simpler syntax compared to the traditional for loop and is especially useful when you want to iterate over the elements themselves, rather than their indices.
  • variable: A variable that will be assigned the current value during each iteration.
  • iterable: The iterable object to be looped over.

HTML

     let numbers = [1, 2, 3, 4, 5];

for (let number of numbers) {
console.log(number);
}

OUTPUT

1
2
3
4
5

Functions :

  • functions are blocks of reusable code that can be defined and called to perform a specific task. Functions can take parameters (inputs), perform actions, and return a value.

 

  • functionName: This is the name of the function. It should be a valid identifier and is used to call the function later in the code.

  • parameters: These are placeholders for values that the function expects to receive when it is called. Parameters are optional, and a function may have none or multiple parameters.

  • code to be executed: This is the block of code enclosed within curly braces {}. It represents the actions or operations that the function performs.

  • return statement (optional): A function can optionally return a value using the return keyword. This value can be used when calling the function.

HTML

 // Function without parameters
function greet() {
    console.log("Hello!");
}

// Function with parameters and a return statement
function addNumbers(a, b) {
    return a + b;
}

// Function call
greet(); // Outputs: Hello!

let sum = addNumbers(3, 5);
console.log(sum); // Outputs: 8

OUTPUT

Hello!
8

Functions and Expression  :

functions can also be defined as expressions. This means you can assign a function to a variable, use it as an argument in another function, or even return it from another function. This type of function is known as an anonymous function, and it’s often used in scenarios where a function is needed for a short period and doesn’t need a name.

  • The greet variable is assigned the value of an anonymous function.
  • The function is defined without a name, making it an anonymous function.
  • The greet variable now holds a reference to this function, and you can call it using greet().

HTML

 function doSomething(action) {
    action();
}

doSomething(function() {
    console.log("Performing an action!");
});

OUTPUT

Performing an action!
2.  Hoisting :
  • Hoisting is a behavior in JavaScript where variable and function declarations are moved to the top of their containing scope during the compilation phase. This means that you can use variables and functions before they are declared in your code.
 
Function Hoisting:
the function declaration function hello() {...} is hoisted to the top, so you can call the function before the declaration in the code.
Hoisting with let and const:
Unlike var, variables declared with let and const are hoisted, but they are not initialized until the actual declaration statement. This is known as the “temporal dead zone.” Attempting to access the variable before the declaration results in a ReferenceError.
Variable Hoisting:
the variable declaration var x; is hoisted to the top, so the first console.log(x) outputs undefined. The assignment x = 5 is not hoisted, so the second console.log(x) outputs the actual value 5.

HTML

 console.log(x); // Outputs: undefined
var x = 5;
console.log(x); // Outputs: 5

hello(); // Outputs: "Hello, World!"
function hello() {
    console.log("Hello, World!");
}

console.log(y); // ReferenceError: y is not defined
let y = 10;
console.log(y); // Outputs: 10

OUTPUT

 undefined
5
Hello, World!
Dear learners, Are you interested in assessing your progress?
Request your mentor to give you access and start your Test.