Odd Number Triangle in JavaScript

Beginner
⏱️ 5 min read
📚 Updated: Aug 2025
🎯 2 Code Examples
Nested Loops + Concatenation
Odd length number triangle output (1, 123, 12345, 1234567, 123456789) in JavaScript programming

What You’ll Learn

How to print an odd-length number triangle where each row concatenates digits from 1 up to the current odd size.

You’ll practice using nested loops and string/number concatenation in JavaScript.

⭐ Pattern Output

For rows = 5, the pattern looks like this:

Output
1
123
12345
1234567
123456789
1

Complete JavaScript Program

The outer loop generates odd row lengths. The inner loop concatenates digits from 1 up to that length.

JavaScript
const rows = 5;

// Outer loop picks odd lengths: 1, 3, 5, 7, 9...
for (let i = 1; i <= 2 * rows - 1; i += 2) {
  let line = "";

  // Inner loop appends digits without spaces.
  for (let j = 1; j <= i; j++) {
    line += j;
  }

  console.log(line);
}
Try it Yourself

🧠 How It Works

1

Set the number of rows

const rows = 5; determines how many odd-length lines we generate.

Row count
2

Outer loop picks odd lengths

for (let i = 1; i <= 2 * rows - 1; i += 2) visits i = 1, 3, 5, 7, 9.

Odd sizes
3

Start a line as empty

let line = ""; prepares an accumulator string for each row.

Accumulator
4

Inner loop concatenates digits

The inner loop appends j from 1 to i, without adding spaces.

No separators
=

Odd-length concatenation triangle

Each row grows by 2 digits, forming the odd-number triangle shape.

2

Variation — Browser (document.write) Version

Print the same triangle directly in an HTML page using document.write:

HTML
<!DOCTYPE html>
<html>
<body>
<script>
const rows = 5;
for (let i = 1; i <= 2 * rows - 1; i += 2) {
  for (let j = 1; j <= i; j++) {
    document.write(j);
  }
  document.write("<br>");
}
</script>
</body>
</html>
Try it Yourself

💡 Tips for Enhancement

Try These

  • Increase rows to generate longer odd concatenation lines
  • Add a separator like ' ' if you want spaced output
  • Build the output using an array and join('') for cleaner code
  • Print the pattern in reverse by counting i from large to small

Avoid

  • Using i += 1 instead of i += 2 (breaks odd-length rows)
  • Accidentally resetting line in the wrong loop scope
  • Adding spaces or separators inside the inner loop when you need concatenation
  • Forgetting the document.write("<br>") after each row in browser output

Key Takeaways

1

The outer loop generates odd row lengths (increment by 2).

2

The inner loop appends digits from 1 to i to form the concatenation.

3

No spaces are added, so rows like 1234567 appear as continuous text.

4

You can switch output methods: console.log vs document.write.

❓ Frequently Asked Questions

It creates odd-length rows (1, 3, 5, 7, ...), which is why the output grows by two digits each row.
In console mode it builds line using line += j (no separator). In browser mode it calls document.write(j) directly.
Yes. For example, do line += j + ' ' or join with ' ' when using an array.
The rows keep growing (for larger i), producing longer digit strings like 1234567891011 and so on.

Explore More JavaScript Number Patterns!

Keep practicing nested loops to build progressive, triangle-shaped output with different rules.

All Number Patterns →
Did you know?

Odd-length digit concatenation is a handy pattern for learning how to convert repeated loops into clean string output.

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)

12 people found this page helpful

JavaScript Number Pattern 21 JavaScript Number Pattern 23