Filled Diamond Star Pattern in JavaScript

Beginner
⏱️ 12 min read
📚 Updated: Aug 2025
🎯 1 Code Example
2*i - 1 stars
Filled diamond star pattern output in JavaScript programming

What You'll Learn

This program prints a filled diamond by combining a centered pyramid (upper half) and an inverted pyramid (lower half).

Upper half: i = 1..rows. Lower half: i = rows - 1..1. Each row prints rows - i spaces and 2*i - 1 stars.

⭐ Pattern Output

When you run the program with rows = 5:

Output
    *
   ***
  *****
 *******
*********
 *******
  *****
   ***
    *
1

Complete JavaScript Program

Fixed rows = 5 version:

JavaScript
const rows = 5;

function printPyramidRow(i, rows) {
  let line = "";
  for (let s = 1; s <= rows - i; s++) line += " ";
  for (let j = 1; j <= 2 * i - 1; j++) line += "*";
  console.log(line);
}

for (let i = 1; i <= rows; i++) {
  printPyramidRow(i, rows);
}
for (let i = rows - 1; i >= 1; i--) {
  printPyramidRow(i, rows);
}
Try it Yourself

🧠 How It Works

1

printPyramidRow (one solid centered line)

function printPyramidRow(i, rows) clears line, adds rows - i spaces, then for (let j = 1; j <= 2 * i - 1; j++) line += "*";, then console.log(line). Every cell inside the outline is a star (unlike Program 9).

Row builder
2

Upper half

for (let i = 1; i <= rows; i++) printPyramidRow(i, rows); grows odd star counts 1, 3, 5, … — same centering idea as Program 5.

Upper
3

Lower half

for (let i = rows - 1; i >= 1; i--) printPyramidRow(i, rows); reuses the same function so the middle row is not printed twice.

Lower
4

Lines, width, mobile

2 * rows - 1 lines total; widest row has 2 * rows - 1 stars. O(n²) output, O(1) extra space. Long rows scroll horizontally in the green preview on small screens.

Complexity
=

Filled diamond

Solid odd-width rows stacked up then down. Optional one-liner per row: " ".repeat(rows - i) + "*".repeat(2 * i - 1).

💡 Tips for Enhancement

Try These

  • Try Program 9 to print a hollow diamond outline
  • Increase rows to make a larger diamond
  • Print spaces between stars using "* ".repeat(2 * i - 1).trimEnd()
  • Replace * with another character
  • Turn it into a double-diamond by printing two diamonds side by side

Avoid

  • Printing the middle row twice (start lower half from rows - 1)
  • Using tabs for alignment (rendering differs)
  • Mixing &nbsp; with normal spaces (output becomes inconsistent)
  • Using even star counts (breaks centering symmetry)
  • Forgetting the line break after each row

Key Takeaways

1

Upper half prints i = 1..rows.

2

Lower half prints i = rows - 1..1 to avoid duplication.

3

Each row prints rows - i spaces and 2*i - 1 stars.

4

Odd star counts keep the shape symmetric.

5

Time complexity is O(n²) due to printing \(\Theta(n^2)\) characters.

❓ Frequently Asked Questions

To avoid printing the widest row twice.
Odd counts ensure there is a single center column, keeping the diamond symmetric.
It’s O(n²) for n rows, since total printed characters are \(\Theta(n^2)\).

Next: Hollow Diamond in Box

Continue to Program 11 to print a hollow diamond inside a square.

Program 11 →
Did you know?

A filled diamond uses the same structure as a hollow diamond, but prints stars across the full width instead of only the borders.

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

9 people found this page helpful

JavaScript Star Pattern 9 JavaScript Star Pattern 11