Hollow Diamond in Square Star Pattern in JavaScript
What You'll Learn
This program prints a square made of stars with a hollow diamond shape inside it (as empty spaces).
For rows = 5, the height is 2*rows - 1 and width is 2*rows.
⭐ Pattern Output
When you run the program with rows = 5:
**********
**** ****
*** ***
** **
* *
** **
*** ***
**** ****
**********Complete JavaScript Program
Fixed rows = 5 version:
const rows = 5;
const height = 2 * rows - 1;
const width = 2 * rows;
for (let line = 1; line <= height; line++) {
if (line === 1 || line === height) {
console.log("*".repeat(width));
continue;
}
const i = line <= rows ? line : (2 * rows - line);
const leftStars = rows - i + 1;
const gap = 2 * (i - 1);
const out = "*".repeat(leftStars) + " ".repeat(gap) + "*".repeat(leftStars);
console.log(out);
}🧠 How It Works
Grid size
const height = 2 * rows - 1; counts lines. const width = 2 * rows; is the length of the solid top and bottom bars. The frame is intentionally even width, unlike the standalone hollow diamond (Program 9).
Top and bottom frame rows
for (let line = 1; line <= height; line++) walks every row. If line === 1 or line === height, console.log("*".repeat(width)); prints the full border, then continue; skips the middle logic.
Middle rows: mirror index and string build
const i = line <= rows ? line : (2 * rows - line); maps lines from top and bottom to the same pattern. const leftStars = rows - i + 1; and const gap = 2 * (i - 1);. const out = "*".repeat(leftStars) + " ".repeat(gap) + "*".repeat(leftStars); prints the hollow diamond cavity between two star columns.
Finish each line
console.log(out) prints interior rows. O(n²) output for n = rows, O(1) extra space besides short strings. Lines of length width scroll horizontally in the green preview on phones.
Diamond inside a box
Solid bars cap a hollow diamond carved from paired star runs. Matches rows = 5 sample output (first lines shown).
💡 Tips for Enhancement
Try These
- Change
rowsto print a larger or smaller pattern - Replace
*with#or@ - Print the diamond as stars and the background as spaces (invert the look)
- Try printing a hollow diamond (Program 9) without the box
- Try a filled diamond (Program 10) and compare
Avoid
- Forgetting that width is
2*rows(not2*rows - 1) - Printing the top/bottom rows using the same inner-row formula
- Using tabs for alignment (rendering differs)
- Mixing
with normal spaces - Not mirroring the
ivalue for the lower half
Key Takeaways
Height is 2*rows - 1 and width is 2*rows.
Top and bottom lines are fully filled with stars.
Middle lines print two star blocks with a space gap between.
The inner space gap is 2*(i - 1) after mirroring.
Time complexity is O(n²) due to printing \(\Theta(n^2)\) characters.
❓ Frequently Asked Questions
rows - i + 1 on both sides.n rows, since output size is \(\Theta(n^2)\).More Star Patterns
Browse the full JavaScript star pattern series for more variations.
This pattern mixes two ideas: a boxed border and a mirrored diamond interior, which is a common technique in ASCII art.
About the author
9 people found this page helpful