Lecture 3: Loops and Strings | JavaScript Full Course

Introduction

This tutorial provides a comprehensive overview of loops and strings in JavaScript, as covered in Lecture 3 of the JavaScript Full Course by Shradha Khapra. Understanding loops is essential for controlling the flow of your programs, while mastering strings is crucial for text manipulation. This guide will walk you through the different types of loops and string handling techniques in JavaScript, complete with practical examples.

Step 1: Understanding the for Loop

The for loop is used to execute a block of code a specific number of times. It's ideal for iterating over arrays or performing repeated actions.

How to Use a for Loop

• Syntax:

  for (initialization; condition; increment) {
      // code to be executed
  }
  

• Example:

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

• Tip: Ensure the condition eventually becomes false to prevent infinite loops.

Step 2: Exploring the while Loop

The while loop continues to execute as long as the specified condition is true.

How to Use a while Loop

• Syntax:

  while (condition) {
      // code to be executed
  }
  

• Example:

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

• Common Pitfall: Make sure to update the variable within the loop to avoid endless loops.

Step 3: Using the do-while Loop

The do-while loop executes the block of code at least once before checking the condition.

How to Use a do-while Loop

• Syntax:

  do {
      // code to be executed
  } while (condition);
  

• Example:

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

• Practical Note: Useful when you want to ensure the code runs at least once.

Step 4: Implementing the for-of Loop

The for-of loop is a modern way to iterate over iterable objects like arrays, strings, or NodeLists.

How to Use a for-of Loop

• Syntax:

  for (const element of iterable) {
      // code to be executed
  }
  

• Example:

  const array = [10, 20, 30];
  for (const num of array) {
      console.log(num);
  }
  

• Tip: This loop simplifies code when dealing with arrays.

Step 5: Utilizing the for-in Loop

The for-in loop is used to iterate over the properties of an object.

How to Use a for-in Loop

• Syntax:

  for (const key in object) {
      // code to be executed
  }
  

• Example:

  const obj = {a: 1, b: 2, c: 3};
  for (const key in obj) {
      console.log(key, obj[key]);
  }
  

• Caution: Avoid using for-in for arrays as it may not iterate in order.

Step 6: Working with Strings in JavaScript

Strings are a sequence of characters and can be manipulated in various ways.

Key Concepts of Strings

• Creating Strings:
  • Use single or double quotes.
  • Example:

    const str = "Hello, World!";
    

• Template Literals:
  • Allow multi-line strings and string interpolation.
  • Syntax:

    const greeting = `Hello, ${name}!`;
    

Step 7: Exploring String Methods

JavaScript provides numerous built-in methods for string manipulation.

Common String Methods

• length: Returns the length of the string.

  console.log(str.length);
  

• toUpperCase(): Converts string to uppercase.

  console.log(str.toUpperCase());
  

• substring(start, end): Extracts a part of a string.

  console.log(str.substring(0, 5)); // "Hello"
  

Conclusion

In this tutorial, you learned about different types of loops in JavaScript, including for, while, do-while, for-of, and for-in. You also explored how to work with strings, including creating them, using template literals, and applying string methods. These concepts are fundamental for effective programming in JavaScript. Next, consider practicing these loops and string methods in your projects to solidify your understanding.