JavaScript Program to Print Hollow Diamond Pattern

Introduction

A hollow diamond pattern consists of stars (*) printed at the boundary of the diamond, while the inside remains hollow (filled with spaces). This pattern includes an upper part that is a hollow pyramid and a lower part that is an inverted hollow pyramid.

Problem Statement

Create a JavaScript program that:

  • Accepts the number of rows for the upper part of the diamond.
  • Prints a hollow diamond pattern using stars (*).

Example:

  • Input: rows = 5
  • Output:
        *
       * *
      *   *
     *     *
    *       *
     *     *
      *   *
       * *
        *
    

Solution Steps

  1. Input the Number of Rows: The user specifies the number of rows for the upper part of the diamond.
  2. Use Nested Loops: The outer loops handle the rows, and the inner loops handle printing the stars and spaces for both the upper and lower parts of the diamond.
  3. Display the Hollow Diamond Pattern: Print stars at the boundaries, and spaces inside the diamond.

JavaScript Program

// Step 1: Input the number of rows for the hollow diamond pattern
let rows = parseInt(prompt("Enter the number of rows: "));

// Step 2: Print the upper part of the hollow diamond (pyramid)
for (let i = 1; i <= rows; i++) {
    let output = '';
    
    // Print leading spaces for alignment
    for (let j = 1; j <= rows - i; j++) {
        output += ' ';
    }
    
    // Print stars and spaces for the hollow part
    for (let k = 1; k <= 2 * i - 1; k++) {
        if (k === 1 || k === 2 * i - 1) {
            output += '*';
        } else {
            output += ' ';
        }
    }
    
    // Print the output for the current row
    console.log(output);
}

// Step 3: Print the lower part of the hollow diamond (inverted pyramid)
for (let i = rows - 1; i >= 1; i--) {
    let output = '';
    
    // Print leading spaces for alignment
    for (let j = 1; j <= rows - i; j++) {
        output += ' ';
    }
    
    // Print stars and spaces for the hollow part
    for (let k = 1; k <= 2 * i - 1; k++) {
        if (k === 1 || k === 2 * i - 1) {
            output += '*';
        } else {
            output += ' ';
        }
    }
    
    // Print the output for the current row
    console.log(output);
}

Explanation

Step 1: Input the Number of Rows

  • The program starts by asking the user for the number of rows for the upper part of the diamond. This input is converted to an integer using parseInt().

Step 2: Print the Upper Part of the Hollow Diamond

  • The outer loop handles the rows for the upper part of the diamond.
    • The first inner loop prints spaces to align the stars in the center.
    • The second inner loop prints stars at the boundary of the pattern (first and last positions of each row). Spaces are printed in between to create the hollow effect.

Step 3: Print the Lower Part of the Hollow Diamond

  • The second outer loop handles the rows for the lower part of the diamond (an inverted hollow pyramid).
    • The first inner loop prints spaces for alignment.
    • The second inner loop prints stars at the boundary, with spaces in between to keep the pattern hollow.

Output Example

For rows = 5, the output will be:

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

For rows = 4, the output will be:

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

Conclusion

This JavaScript program prints a hollow diamond pattern using stars (*). The program uses nested loops to print both the upper and lower parts of the hollow diamond, with spaces between the boundary stars to create the hollow effect. This exercise helps in practicing loop control, conditional logic, and output formatting in JavaScript.

Comments