Nested Loops in JavaScript

Structure of Nested Loops: 3

Example 1: Multiplication Table 4
Example 2: 2D Array Iteration 4
Coding exercises involving nested loops 6
Exercise 1: Print a Square 6
Exercise 2: Print a Right Triangle 7
Exercise 3: Print an Upside-Down Right Triangle 8
Exercise 4: Print a Hollow Square 9
Exercise 5: Print a Number Triangle 10
Exercise 6: Print a Diamond 12
Exercise 7: Print Pascal's Triangle 13
Exercise 8: Print Hollow Pyramid 15
Exercise 9: Print Half Pyramid Using Numbers 16
Exercise 10: Print Inverted Half Pyramid 17
JavaScript Quiz Questions 19
1. Question: What is a nested loop in JavaScript? 19
2. Question: Why would you use nested loops in JavaScript? 19
3. Question: How is the structure of nested loops in JavaScript? 19
4. Question: What is the role of the outer loop in nested loops? 19

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
1
5. Question: How is a square pattern of asterisks printed using nested loops? 19
6. Question: Which loop is used to iterate through rows in a nested loop? 20
7. Question: How do you print a right triangle pattern of asterisks using nested
loops? 20
a. A) Using a single loop 20
8. Question: What is the output of a right triangle pattern with a height of 4?20
9. Question: How do you print an upside-down right triangle pattern of
asterisks? 20
10. Question: What is the output of an upside-down right triangle pattern with
a height of 3? 21
11. Question: How do you print a hollow square pattern of asterisks using
nested loops? 21
12. Question: What is the output of a hollow square pattern with a side length
of 5? 21
13. Question: How do you print a number triangle pattern using nested loops?
21
14. Question: What is the output of a number triangle pattern with a height of
3? 22
15. Question: How do you print a diamond pattern of asterisks using nested
loops? 22
16. Question: What is the output of a diamond pattern with a height of 5? 22
17. Question: How do you print Pascal's Triangle using nested loops? 22
18. Question: What is the output of Pascal's Triangle with 4 rows? 23
19. Question: How do you print a hollow pyramid pattern of asterisks using
nested loops? 23
20. Question: What is the output of a hollow pyramid pattern with a height of
4? 23
21. Question: How do you print a half pyramid pattern using numbers? 23
22. Question: What is the output of a half pyramid pattern using numbers with
a height of 4? 24
23. Question: How do you print an inverted half pyramid pattern of asterisks
using nested loops? 24

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
2
 24. Question: What is the output of an inverted half pyramid pattern with a
height of 3? 24
25. Question: How can nested loops be extended to more than two levels? 24
26. Question: What should you be mindful of when using nested loops? 25
27. Question: In a nested loop, how is an outer loop related to the inner loop?
25
28. Question: What is the role of the inner loop in a nested loop? 25
29. Question: How do you handle conditions for nested loops in JavaScript? 25
30. Question: How do you print a hollow rectangle pattern of asterisks using
nested loops? 25
Answers: 26

Nested Loops in JavaScript

Nested loops are loops within loops, allowing for more complex
iterations through data structures like arrays or matrices. This
concept is crucial for handling multidimensional data and
performing operations on each element.

Structure of Nested Loops:

for (let i = 0; i < outerLength; i++) {
for (let j = 0; j < innerLength; j++) {
// Code to be executed for each combination of i and j
}
}
Here's a breakdown:

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
3
 1. The outer loop (controlled by the variable i) runs from its
starting point to the specified condition (outerLength).
2. The inner loop (controlled by the variable j) runs completely
for each iteration of the outer loop, from its starting point to
its condition (innerLength).
3. The inner loop completes its full cycle for each iteration of
the outer loop.

Example 1: Multiplication Table

// Displaying a multiplication table for numbers 1 to 5
for (let i = 1; i <= 5; i++) {
for (let j = 1; j <= 10; j++) {
[Link](`${i} * ${j} = ${i * j}`);
}
[Link]('\n'); // Adding a newline for better readability
}

Example 2: 2D Array Iteration

// Iterating through a 2D array
const matrix = [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9]

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
4
];

for (let i = 0; i < [Link]; i++) {

for (let j = 0; j < matrix[i].length; j++) {
[Link](matrix[i][j]);
}
}
Key Points:

Ensure clear understanding of the loop conditions to avoid infinite

loops.
Nested loops can be extended to more than two levels based on
the complexity of the task.
Be mindful of performance considerations, especially with deeply
nested loops.
Nested loops are a powerful tool, enabling you to solve a wide
range of problems efficiently. Practice and experimentation are
key to mastering this concept!

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
5
Coding exercises involving nested loops

Exercise 1: Print a Square

Description: Write a function to print a square pattern of
asterisks.

Steps:
1. Define a function printSquare that takes a parameter for the
side length.
2. Use nested loops to print a square pattern.
Code Example:
function printSquare(sideLength) {
for (let i = 0; i < sideLength; i++) {
let row = '';
for (let j = 0; j < sideLength; j++) {
row += '* ';
}
[Link](row);
}
}

printSquare(5);
Solution:

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
6
*****
*****
*****
*****
*****

Exercise 2: Print a Right Triangle

Description: Write a function to print a right triangle pattern of
asterisks.

Steps:
1. Define a function printRightTriangle that takes a parameter
for the triangle's height.
2. Use nested loops to print a right triangle pattern.
Code Example:
function printRightTriangle(height) {
for (let i = 0; i < height; i++) {
let row = '';
for (let j = 0; j <= i; j++) {
row += '* ';
}
[Link](row);
}
}

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
7
printRightTriangle(5);
Solution:
*
**
***
****
*****

Exercise 3: Print an Upside-Down Right Triangle

Description: Write a function to print an upside-down right
triangle pattern of asterisks.

Steps:
1. Define a function printUpsideDownTriangle that takes a
parameter for the triangle's height.
2. Use nested loops to print an upside-down right triangle
pattern.
Code Example:
function printUpsideDownTriangle(height) {
for (let i = height; i > 0; i--) {
let row = '';
for (let j = 0; j < i; j++) {
row += '* ';

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
8
 }
[Link](row);
}
}

printUpsideDownTriangle(5);
Solution:
*****
****
***
**
*

Exercise 4: Print a Hollow Square

Description: Write a function to print a hollow square pattern of
asterisks.

Steps:
1. Define a function printHollowSquare that takes a parameter
for the side length.
2. Use nested loops to print a hollow square pattern.
Code Example:
function printHollowSquare(sideLength) {
for (let i = 0; i < sideLength; i++) {

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
9
 let row = '';
for (let j = 0; j < sideLength; j++) {
if (i === 0 || i === sideLength - 1 || j === 0 || j ===
sideLength - 1) {
row += '* ';
} else {
row += ' ';
}
}
[Link](row);
}
}

printHollowSquare(5);
Solution:

*****
* *
* *
* *
*****

Exercise 5: Print a Number Triangle

Description: Write a function to print a number triangle pattern.

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
10
Steps:

1. Define a function printNumberTriangle that takes a

parameter for the triangle's height.
2. Use nested loops to print a number triangle pattern.
Code Example:
function printNumberTriangle(height) {
let number = 1;
for (let i = 0; i < height; i++) {
let row = '';
for (let j = 0; j <= i; j++) {
row += number++ + ' ';
}
[Link](row);
}
}

printNumberTriangle(4);
Solution:
1
23
456
7 8 9 10

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
11
Exercise 6: Print a Diamond
Description: Write a function to print a diamond pattern of
asterisks.

Steps:
1. Define a function printDiamond that takes a parameter for
the diamond's height.
2. Use nested loops to print a diamond pattern.
Code Example:
function printDiamond(height) {
for (let i = 0; i < height; i++) {
let row = '';
for (let j = 0; j < height - i; j++) {
row += ' ';
}
for (let k = 0; k <= i * 2; k++) {
row += '*';
}
[Link](row);
}
for (let i = height - 2; i >= 0; i--) {
let row = '';
for (let j = 0; j < height - i; j++) {

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
12
 row += ' ';
}
for (let k = 0; k <= i * 2; k++) {
row += '*';
}
[Link](row);
}
}

printDiamond(5);
Solution:
*
***
*****
*******
*********
*******
*****
***
*

Exercise 7: Print Pascal's Triangle

Description: Write a function to print Pascal's Triangle.

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
13
Steps:

1. Define a function printPascalsTriangle that takes a parameter

for the number of rows.
2. Use nested loops to calculate and print Pascal's Triangle.
Code Example:
function printPascalsTriangle(rows) {
for (let i = 0; i < rows; i++) {
let row = '';
let coefficient = 1;
for (let j = 0; j <= i; j++) {
row += coefficient + ' ';
coefficient = coefficient * (i - j) / (j + 1);
}
[Link](row);
}
}

printPascalsTriangle(5);
Solution:
1
11
121
1331

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
14
14641

Exercise 8: Print Hollow Pyramid

Description: Write a function to print a hollow pyramid pattern of
asterisks.

Steps:
1. Define a function printHollowPyramid that takes a parameter
for the pyramid's height.
2. Use nested loops to print a hollow pyramid pattern.
Code Example:
function printHollowPyramid(height) {
for (let i = 0; i < height; i++) {
let row = '';
for (let j = 0; j < height - i; j++) {
row += ' ';
}
for (let k = 0; k <= i * 2; k++) {
if (k === 0 || k === i * 2 || i === height - 1) {
row += '*';
} else {
row += ' ';
}
}

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
15
 [Link](row);
}
}

printHollowPyramid(5);
Solution:
*
**
* *
* *
* *
*********

Exercise 9: Print Half Pyramid Using Numbers

Description: Write a function to print a half pyramid pattern using
numbers.

Steps:
1. Define a function printHalfPyramidNumbers that takes a
parameter for the pyramid's height.
2. Use nested loops to print a half pyramid pattern using
numbers.
Code Example:

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
16
function printHalfPyramidNumbers(height) {
for (let i = 1; i <= height; i++) {
let row = '';
for (let j = 1; j <= i; j++) {
row += j + ' ';
}
[Link](row);
}
}

printHalfPyramidNumbers(4);
Solution:
1
12
123
1234

Exercise 10: Print Inverted Half Pyramid

Description: Write a function to print an inverted half pyramid
pattern of asterisks.

Steps:

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
17
 1. Define a function printInvertedHalfPyramid that takes a
parameter for the pyramid's height.
2. Use nested loops to print an inverted half pyramid pattern.
Code Example:
function printInvertedHalfPyramid(height) {
for (let i = height; i >= 1; i--) {
let row = '';
for (let j = 1; j <= i; j++) {
row += '* ';
}
[Link](row);
}
}

printInvertedHalfPyramid(5);
Solution:
*****
****
***
**
*

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
18
JavaScript Quiz Questions

1. Question: What is a nested loop in JavaScript?

a. A) A loop with a complex condition
b. B) A loop inside another loop
c. C) A loop with no conditions

2. Question: Why would you use nested loops in JavaScript?

a. A) To simplify code
b. B) To make the code more readable
c. C) To handle multidimensional data and perform operations on each element

3. Question: How is the structure of nested loops in

JavaScript?
a. A) Single loop with multiple conditions
b. B) Multiple loops written sequentially
c. C) A loop inside another loop

4. Question: What is the role of the outer loop in nested

loops?
a. A) It runs completely for each iteration of the inner loop
b. B) It handles conditions for both loops
c. C) It runs independently of the inner loop

5. Question: How is a square pattern of asterisks printed

using nested loops?
a. A) Using a single loop
b. B) Using an inner loop for rows and another for columns

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
19
c. C) Using separate loops for each row and column

6. Question: Which loop is used to iterate through rows in a

nested loop?
a. A) Outer loop
b. B) Inner loop
c. C) Both loops together

7. Question: How do you print a right triangle pattern of

asterisks using nested loops?
a. A) Using a single loop
b. B) Using an inner loop for rows and another for columns
c. C) Using separate loops for each row and column

8. Question: What is the output of a right triangle pattern

with a height of 4?
a. A) ****

b. B) *

c. C) *

9. Question: How do you print an upside-down right triangle

pattern of asterisks?
a. A) Using a single loop
b. B) Using an inner loop for rows and another for columns
c. C) Using separate loops for each row and column

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
20
10. Question: What is the output of an upside-down right
triangle pattern with a height of 3?
a. A) ***

b. B) *

c. C) * * *

11. Question: How do you print a hollow square pattern of

asterisks using nested loops?
a. A) Using a single loop
b. B) Using an inner loop for rows and another for columns
c. C) Using separate loops for each row and column

12. Question: What is the output of a hollow square pattern

with a side length of 5?
a. A) *****

b. B) * *

c. C) * * *

13. Question: How do you print a number triangle pattern

using nested loops?
a. A) Using a single loop
b. B) Using an inner loop for rows and another for columns
c. C) Using separate loops for each row and column

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
21
14. Question: What is the output of a number triangle pattern
with a height of 3?
a. A) 1

b. B) 1 2 3

c. C) 1 2 3 4

15. Question: How do you print a diamond pattern of asterisks

using nested loops?
a. A) Using a single loop
b. B) Using an inner loop for rows and another for columns
c. C) Using separate loops for each row and column

16. Question: What is the output of a diamond pattern with a

height of 5?
a. A) See code example in previous response.
b. B) *

c. C) ***

17. Question: How do you print Pascal's Triangle using nested

loops?
a. A) Using a single loop
b. B) Using an inner loop for rows and another for columns
c. C) Using separate loops for each row and column

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
22
18. Question: What is the output of Pascal's Triangle with 4
rows?
a. A) See code example in previous response.
b. B) 1 2 1

c. C) 1 1 1

19. Question: How do you print a hollow pyramid pattern of

asterisks using nested loops?
a. A) Using a single loop
b. B) Using an inner loop for rows and another for columns
c. C) Using separate loops for each row and column

20. Question: What is the output of a hollow pyramid pattern

with a height of 4?
a. A) See code example in previous response.
b. B) *

c. C) ***

21. Question: How do you print a half pyramid pattern using

numbers?
a. A) Using a single loop
b. B) Using an inner loop for rows and another for columns
c. C) Using separate loops for each row and column

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
23
22. Question: What is the output of a half pyramid pattern
using numbers with a height of 4?
a. A) See code example in previous response.
b. B) 1

c. C) 1 2

23. Question: How do you print an inverted half pyramid

pattern of asterisks using nested loops?
a. A) Using a single loop
b. B) Using an inner loop for rows and another for columns
c. C) Using separate loops for each row and column

24. Question: What is the output of an inverted half pyramid

pattern with a height of 3?
a. A) See code example in previous response.
b. B) ***

c. C) *

25. Question: How can nested loops be extended to more than

two levels?
a. A) Not possible
b. B) By using additional conditions in a single loop
c. C) By adding more loops inside existing loops

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
24
26. Question: What should you be mindful of when using
nested loops?
a. A) Performance considerations
b. B) Code readability only
c. C) Number of iterations

27. Question: In a nested loop, how is an outer loop related to

the inner loop?
a. A) They are independent
b. B) The inner loop is optional
c. C) The outer loop controls the number of iterations for the inner loop

28. Question: What is the role of the inner loop in a nested

loop?
a. A) It runs completely for each iteration of the outer loop
b. B) It handles conditions for both loops
c. C) It runs independently of the outer loop

29. Question: How do you handle conditions for nested loops

in JavaScript?
a. A) Using only the outer loop
b. B) Using only the inner loop
c. C) Using both the outer and inner loops

30. Question: How do you print a hollow rectangle pattern of

asterisks using nested loops?
a. A) Using a single loop

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
25
b. B) Using an inner loop for rows and another for columns
c. C) Using separate loops for each row and column

Answers:
1. B) A loop inside another loop
2. C) To handle multidimensional data and perform operations on each element
3. C) A loop inside another loop
4. A) It runs completely for each iteration of the inner loop
5. B) Using an inner loop for rows and another for columns
6. A) Outer loop
7. B) Using an inner loop for rows and another for columns
8. C) *
9. B) Using an inner loop for rows and another for columns
10. C) * * *
11. B) Using an inner loop for rows and another for columns
12. B) * *
13. B) Using an inner loop for rows and another for columns
14. C) 1 2 3 4
15. B) Using an inner loop for rows and another for columns
16. A) See code example in previous response.
17. C) Using separate loops for each row and column
18. B) 1 2 1
19. C) ***
20. A) See code example in previous response.
21. B) Using an inner loop for rows and another for columns
22. C) 1 2 3
23. B) Using an inner loop for rows and another for columns

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
26
24. A) See code example in previous response.
25. C) By adding more loops inside existing loops
26. A) Performance considerations
27. C) The outer loop controls the number of iterations for the inner loop
28. A) It runs completely for each iteration of the outer loop
29. C) Using both the outer and inner loops
30. B) Using an inner loop for rows and another for columns

Learn more about JavaScript with Examples and Source Code Laurence Svekis
Courses [Link]
27