Descending Numbers with Diagonal Asterisk in JavaScript

Beginner

⏱️ 8 min read

📚 Updated: Sep 2026

🎯 3 Code Examples

🚀 Live Preview

Conditional Print

Descending numbers with diagonal asterisk output (5432* to *4321) in JavaScript programming

Overview

What You’ll Learn

The descending number pattern with diagonal asterisk prints 5432*, 543*1, 54*21, 5*321, *4321 — a natural step after the bidirectional triangle in Program 25. This tutorial covers descending digits, the i === j condition, a live preview, algorithm steps, worked JavaScript examples, edge cases, and complexity.

Shape Rule

Diagonal star

Each row prints descending digits with one * where i === j — the star moves left each row.

Outer Loop

i = 1..n

for (let i = 1; i <= n; i++) walks each row top to bottom.

Descending Inner Loop

j = n..1

for (let j = n; j >= 1; j--) prints digits 5, 4, 3, 2, 1 per row.

Diagonal Condition

i === j

When i === j, print *; otherwise print j.

Live Preview

3–9 size

Pick a size n and draw the diagonal asterisk pattern instantly in the browser.

O(n²)

Complexity

Each row prints n characters; total work scales as n².

Introduction

A descending number pattern with diagonal asterisk prints digits from n down to 1 on each row, replacing one position with * where i === j. With n = 5, the output is 5432*, 543*1, 54*21, 5*321, *4321.

In JavaScript you use an outer loop for rows, a descending inner loop for columns, and an if i === j to swap a digit for a star.

Why it matters?

It combines row/column indexing with a conditional swap — a step up from Program 25’s digit mapping.

Key Highlights

Descending j

j = n..1 — digits decrease left to right.

Diagonal star

i === j marks the star position.

Moving star

As i grows, the star shifts left each row.

Series Foundation

Follow Program 25; continue to Program 27 (palindrome triangle) next.

In short: for each i, scan j from n down to 1 — append * when i === j, else append j, then console.log(line).

Foundation

📝 Problem & Approach

Given a positive integer n (e.g. 5), print n rows of descending digits with one diagonal * per row where i === j.

JavaScript

# n = 5 (conceptual shape)
# 5432*
# 543*1
# 54*21
# 5*321
# *4321

Inputs & Outputs

Item	Type	Description
`n`	int	Pattern size — outer loop runs from `1` to `n`.
`i`	int	Outer loop — current row number; also the diagonal star column.
`j`	int	Inner loop — descending column digit from `n` down to `1`.
Output	char	`*` when `i === j`; otherwise the digit `j`.

Minimal workflow

Pseudocode

for i from 1 to n:
    line = ""
    for j from n down to 1:
        if i === j:
            line += "*"
        else:
            line += j
    console.log(line)

Approach comparison

Approach	Idea	Best for
if i === j	`5432`, `5431`, …	Learning and interviews
Custom symbol	Replace `*` with `#` or any char	Visual variants
User-input n	`const n = parseInt(prompt(...), 10)`	Flexible console programs

Cheat Sheet

⚡ Quick Reference

Goal	Pattern
Walk rows	`for (let i = 1; i <= n; i++)`
Descending columns	`for (let j = n; j >= 1; j--)`
Diagonal star	`if (i === j) { line += "*"; }`
Otherwise digit	`else { line += j; }`
End the row	`console.log(line)`
User input	`const n = parseInt(prompt(...), 10)`

Compare

📋 Fixed n vs Custom Symbol vs User Input

Same diagonal asterisk pattern — different ways to control size and the replacement character.

Outer loop

i = 1..n

Row index doubles as star column

Inner loop

j = n..1

Descending digits per row

Condition

i === j

Swap digit for star on diagonal

Learning tip

if/else

One inner loop handles star vs digit

Context

When This Pattern Shows Up

Reach for this pattern when teaching row/column indexing, conditional character substitution, and diagonal effects in nested loops.

Post triangle exercise
Natural follow-up after Program 25 — introduces i === j diagonal substitution.
Nested-loop warm-up
Outer/inner bound practice with an immediate visual check.
Console I/O practice
Combine loops with prompt() for a flexible row count.
Gateway to variants
Compare Program 25 (bidirectional triangle) and Program 27 (palindrome triangle) next.
Not a UI layout tool
This is a console teaching pattern — not how you build modern app screens.

Key benefit: one small program that locks in nested loops, output sequencing, and O(n²) thinking.

Interactive

🔮 Live Preview

Choose a size between 3 and 9 and draw the descending diagonal asterisk pattern in the browser.

Hands-On

Examples Gallery

Three complete JavaScript programs — fixed size, custom symbol, and user input. Click View Output to reveal sample console results, or Try it Yourself to run the code live.

📚 Getting Started

Print five rows of the diagonal asterisk pattern with i === j.

Example 1 — Fixed `n = 5`

Hard-coded size — ideal for first demos and screenshots.

JavaScript

const n = 5;

for (let i = 1; i <= n; i++) {
  let line = "";
  for (let j = n; j >= 1; j--) {
    if (i === j) {
      line += "*";
    } else {
      line += j;
    }
  }
  console.log(line);
}

Try it Yourself

How It Works

When i = 1, the star lands at j = 1 (rightmost) — output 5432*. When i = 5, the star is at the leftmost position — output *4321. Each row always prints n characters.

📈 Custom Symbol

Replace the diagonal asterisk with another character like #.

Example 2 — Custom Symbol `#`

Keep n = 5 but use hash instead of asterisk on the diagonal.

JavaScript

const n = 5;

for (let i = 1; i <= n; i++) {
  let line = "";
  for (let j = n; j >= 1; j--) {
    if (i === j) {
      line += "#";
    } else {
      line += j;
    }
  }
  console.log(line);
}

Try it Yourself

How It Works

Only the replacement character changes — "#" instead of "*". Loop bounds and the i === j condition stay the same as Example 1.

⚡ User Input

Read the pattern size with prompt() instead of hard-coding 5.

Example 3 — User Input

Read n with prompt() and parseInt(); both loops use n as the bound.

JavaScript

const nInput = prompt("Enter size:");
const n = parseInt(nInput, 10);

for (let i = 1; i <= n; i++) {
  let line = "";
  for (let j = n; j >= 1; j--) {
    if (i === j) {
      line += "*";
    } else {
      line += j;
    }
  }
  console.log(line);
}

Try it Yourself

How It Works

Same i === j core as Example 1; only the source of n changes. The diagonal star scales with the user’s input. Non-numeric input yields NaN with bare parseInt(prompt(), 10) — validate with Number.isFinite for safer labs.

🧠 How the Algorithm Prints Rows

Set up

console.log is built in; use prompt() when reading input. Set loop variables i, j and n = 5.

Setup

Outer loop walks rows

for (let i = 1; i <= n; i++) — row index also marks the star column.

Row

Descending inner loop (j)

for (let j = n; j >= 1; j--) — prints digits n..1 per row.

Columns

Diagonal substitution

if (i === j) appends *; else line += j.

if/else

New line

console.log(line) ends the row after the inner loop.

Break

Diagonal asterisk complete

Star moves left each row — O(n²) time, O(1) extra memory.

Trace

🔎 Worked Walkthrough — `n = 5`

Trace each outer-loop value of i, where i === j, and the full row output.

`i`	Star at `j`	Digits printed	Row output
`1`	`j = 1`	5, 4, 3, 2, *	`5432*`
`2`	`j = 2`	5, 4, 3, *, 1	`543*1`
`3`	`j = 3`	5, 4, *, 2, 1	`54*21`
`4`	`j = 4`	5, *, 3, 2, 1	`5*321`
`5`	`j = 5`	*, 4, 3, 2, 1	`*4321`

The star position moves left as i increases — each row still prints exactly n characters.

Use Cases

Where this tiny pattern (and its loop structure) shows up beyond the homework prompt.

1. Teaching Nested Loops

Clearest visual proof that outer and inner bounds interact.

Example: change j = n..1 to j = 1..n and watch digit order flip.

2. Pattern Series Base

Foundation for inverted, pyramid, diamond, and hollow variants.

Example: use i + j == n + 1 for the anti-diagonal star.

3. Console Formatting Drills

Practice line += vs console.log(line) without complex math.

Example: put console.log(line) inside the inner loop by mistake.

4. Character Substitution

Swap digits for letters or add spaces once the loop works.

Example: replace * with # or a space character.

5. Complexity Intuition

Triangular totals make O(n²) concrete for beginners.

Example: count printed chars for n = 5 → 5 × 5 = 25.

6. Input Validation Labs

Pair the pattern with Number.isFinite and positive-n checks.

Example: reject n <= 0 and re-prompt.

Pro Tip: when an interviewer asks for patterns, explain the outer/inner roles first — then write the loops. The story matters as much as the code.

Advantages

Why this pattern earns a permanent spot in beginner JavaScript courses.

1. Instant Visual Feedback
Wrong bounds show up immediately as a broken staircase.
2. Minimal Concepts
Only loops and console output — no arrays or math libraries.
3. Easy to Extend
Invert, center, hollow, or change the fill character with small edits.
4. O(1) Extra Memory
Streaming output needs no storage beyond loop counters.

Pro Tip: trace i and j on paper for n = 3 before coding — the star column is where they meet.

Usage Tips

Small habits that keep number-pattern code clean.

1. Name Bounds Clearly
Do not print i in the else branch — use j for the descending digit.
2. Validate prompt()
Validate parseInt(prompt(), 10) with Number.isFinite so bad input does not produce NaN.
3. Keep console.log(line) Outside
Only call console.log(line) after the inner loop finishes the row.
4. Trace i and j on Paper
Mark where i === j on each row before coding.
5. Dry-Run One Small n
Trace n = 3 on paper before coding larger demos.

Pro Tip: if the output is a vertical list of single digits per line, you almost certainly put console.log(line) inside the inner loop.

Common Pitfalls

Mistakes that commonly break diagonal asterisk patterns.

1. Newline Inside the Inner Loop
Each digit lands on its own line — you get a column, not a triangle.
→ Use line += "*" or line += j; console.log(line) only after the inner loop.
2. Using i != j Instead of i === j
Flipping the condition prints stars everywhere except the diagonal.
→ Print * when i === j, not when they differ.
3. Ascending Inner Loop
Using j = 1..n reverses the digit order on each row.
→ Use for (let j = n; j >= 1; j--) for descending digits.
4. Printing i Instead of j
Writing line += i in the else branch repeats the row number, not the column digit.
→ Print j in the else branch — it holds the descending column value.
5. Unchecked input
Letters or empty input yield NaN from bare parseInt(prompt(), 10).
→ Validate with Number.isFinite and re-prompt on failure.

Edge Cases

Check these inputs before calling the solution done.

n = 1

Single row

Output is just * — one star, one row.

n = 0

Empty pattern

Outer loop never runs — print nothing or show a message.

Negative

`n < 0`

Treat as invalid; re-prompt instead of silent empty output.

n = 2

Smallest diagonal

Two rows: 2* and *1.

Bad input

Non-numeric input

parseInt(prompt(), 10) yields NaN — validate with Number.isFinite first.

Large n

Large size

Output grows as n² characters — fine for labs, noisy for huge n.

Drill

🎯 Practice Problems

Try these variations to lock in the pattern.

1. Bidirectional triangle

Shrinking rows with digit mapping
Review Program 25

2. Palindrome triangle

Symmetric rows with two inner loops
Continue with Program 27

3. Anti-diagonal star

Use i + j == n + 1 instead of i === j
Compare star position on each row

4. Multiple diagonals

Print * when i === j or i + j == n + 1
Harder follow-up after this page

Important

Notes

Diagonal rule. When i === j, print *; otherwise print descending digit j.
line += stays on the line; console.log(line) advances — mix them carefully.
Validate n > 0 for interactive programs; n = 1 prints a single *.
Any single character works as the diagonal replacement — #, X, or a space.

Quick Takeaway: outer loop i = 1..n, descending inner loop j = n..1, append * when i === j else j, then console.log(line) after each row.

Analysis

⏱️ Time and Space Complexity

Program	Time	Extra space
Nested loops (Examples 1 & 3)	`O(n²)`	`O(1)`
Custom symbol (Example 2)	`O(n²)`	`O(1)`

Wrap Up

🎉 Conclusion

The descending number pattern with diagonal asterisk is a compact lesson in row/column indexing: print descending j values and swap one position with * when i === j. Master the fixed-n version, then try a custom symbol and user input.

Practice the three examples above, then continue to Program 27 for the palindrome number triangle.

Print j in the else branch, not i — validate n when reading from the console.

View Examples Gallery Continue to Program 27

Pro Tips

💡 Best Practices

✅ Do

Use for (let i = 1; i <= n; i++) in the outer loop
Descend with for (let j = n; j >= 1; j--)
Print * when i === j, else print j
Validate parseInt(prompt(), 10) with Number.isFinite before using n
State O(n²) time when asked about complexity

❌ Don’t

Call console.log(line) inside the inner loop
Print i instead of j in the else branch
Flip the condition to i != j
Use ascending j unless you want reversed digits
Ignore bad console input in user-facing demos
Skip the n = 1 edge case

Summary

Key Takeaways

Knowledge Unlocked

Five things to remember about this diagonal pattern

Print the pattern the beginner-friendly way.

Core concepts

△ 01

Rule

i === j → *

Definition

↻ 02

j = n..1

Descending

Code

+ 03

if/else

* or j

Code

↑ 04

Moving star

Left each row

Shape

O 05

Complexity

O(n²) time

Analysis

❓ Frequently Asked Questions

Why does the * move left each row?

Because i increases from 1 to n while j decreases from n to 1. The condition i === j becomes true at a different position each row.

Why append j in the else branch?

j holds the descending column digit (5, 4, 3, 2, 1). When i !== j, append that digit to fill the row.

Can I replace the diagonal with another character?

Yes. Replace line += "*" with any character or string — see Example 2 with #.

What is the difference between line += and console.log(line)?

line += j appends each digit or star on the same line. console.log(line) ends the row after the inner loop finishes.

Why use a reverse inner loop?

j runs from n down to 1 so each row prints digits in descending order with the star at position i.

How do I generalize for any size?

Replace 5 with n in both loops — see Example 3 and the live preview.

What is the time complexity?

O(n²) for n rows because each row prints n characters using a nested loop.

How should I read n safely?

Use parseInt with Number.isFinite or validate the raw string before converting so bad input does not produce NaN.

What happens when n is 1?

Only one row prints — a single *.

Did you Know? 🔊

This pattern prints descending numbers from n to 1 on each row. When the row index equals the current column value (i === j), it appends * instead of the number, creating a diagonal asterisk that moves left each row.

Continue to Program 27

Move on to the palindrome number triangle in the JavaScript number-pattern series.

Program 27 tutorial →

About the author

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)

12 people found this page helpful

JavaScript Number Pattern 25 — Bidirectional Number Triangle JavaScript Number Pattern 27 — Palindrome Number Triangle

Descending Numbers with Diagonal Asterisk in JavaScript

What You’ll Learn

Shape Rule

Outer Loop

Descending Inner Loop

Diagonal Condition

Live Preview

O(n²)

Introduction

Why it matters?

Descending j

Diagonal star

Moving star

Series Foundation

📝 Problem & Approach

Inputs & Outputs

Minimal workflow

Approach comparison

⚡ Quick Reference

📋 Fixed n vs Custom Symbol vs User Input

When This Pattern Shows Up

Post triangle exercise

Nested-loop warm-up

Console I/O practice

Gateway to variants

Not a UI layout tool

🔮 Live Preview

Examples Gallery

📚 Getting Started

Example 1 — Fixed n = 5

How It Works

📈 Custom Symbol

Example 2 — Custom Symbol #

How It Works

⚡ User Input

Example 3 — User Input

How It Works

🧠 How the Algorithm Prints Rows

Set up

Outer loop walks rows

Descending inner loop (j)

Diagonal substitution

New line

Diagonal asterisk complete

🔎 Worked Walkthrough — n = 5

Use Cases

1. Teaching Nested Loops

2. Pattern Series Base

3. Console Formatting Drills

4. Character Substitution

5. Complexity Intuition

6. Input Validation Labs

Advantages

1. Instant Visual Feedback

2. Minimal Concepts

3. Easy to Extend

4. O(1) Extra Memory

Usage Tips

1. Name Bounds Clearly

2. Validate prompt()

3. Keep console.log(line) Outside

4. Trace i and j on Paper

5. Dry-Run One Small n

Common Pitfalls

1. Newline Inside the Inner Loop

2. Using i != j Instead of i === j

3. Ascending Inner Loop

4. Printing i Instead of j

5. Unchecked input

Edge Cases

Single row

Empty pattern

n < 0

Smallest diagonal

Non-numeric input

Large size

🎯 Practice Problems

1. Bidirectional triangle

2. Palindrome triangle

3. Anti-diagonal star

Example 1 — Fixed `n = 5`

Example 2 — Custom Symbol `#`

🔎 Worked Walkthrough — `n = 5`

2. Validate `prompt()`

3. Keep `console.log(line)` Outside

`n < 0`