sequential number triangle with user-defined last number in JAVASCRIPT

Question

I am a complete novice at programming who is following a course in JavaScript as my first language.

Our current task is to use the any of the following:

for loop
while loop
Nesting
document.write

to create the following result (without the additional enter):

1
2 3
4 5 6
7 8 9 10
11 12 13 14

The last number in the sequence must be user-defined.

I am able to produce the following:

1
1 2 
1 2 3 
1 2 3 4 
1 2 3 4 5 
1 2 3 4 5 6

using edit: please note that the var "rows" is misleading (see bold text above):

var rows = parseInt(prompt("choose end number"))
var i 
var j 

for (i = 1; i <= rows; i++)
{
    for(j=1; j<=i; j++)
    {
        document.write(j + " "); 
    }
    document.write("<br>");
}

But I am not able to create something that breaks and then continues the sequence on the next line.

If you have the time, could you also give me an explanation of the code you post in terms of how the computer processes it and why it works?

Andrew Ingram · Accepted Answer · 2018-06-08 17:15:40Z

1

Not sure if i'd do it differently in practice, but this works:

var endNumber = parseInt(prompt("choose end number"))
var rowLength = 1; 
var rowCounter = 0;

for (var i = 1; i <= endNumber; i++) {
    document.write(i + " ");

    rowCounter++;

    if (rowCounter === rowLength) {
        rowLength++;
        rowCounter = 0;
        document.write("<br>");
    }
}

Explanation

My thought process was essentially that there are two parts to the problem. (1) printing numbers from 1 to end value, and (2) inserting line breaks at certain points.

Printing the numbers is the easy part, you just need to do this:

var endNumber = parseInt(prompt("choose end number"));

for (var i = 1; i <= endNumber; i++) {
    document.write(i + " ");
}

The remaining part of the problem is to insert line break between numbers, initially with an interval of 1, and increasing by 1 each time. So we initialise two variables, one represents the current row length (starting at 1), and the other represents a counter within the current row (starting at 0).

var rowLength = 1; 
var rowCounter = 0;

Then inside the forloop, we increment the counter by 1 each time, and check whether it matches the row length. If it matches, we reset the counter, increase the line length by 1 and reset the counter.

    rowCounter++;

    if (rowCounter === rowLength) {
        rowLength++;
        rowCounter = 0;
        document.write("<br>");
    }

edited Jun 8, 2018 at 17:15

answered Jun 8, 2018 at 16:36

Andrew Ingram

5,2402 gold badges28 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

MR_ GB Over a year ago

Awesome that works, thanks. Could I trouble you for an explanation of the second half? I kind of get it and I kind of don't.

Andrew Ingram Over a year ago

Expanded answer with an explanation

MR_ GB Over a year ago

Thank you so much for the additional (and very clearly laidout) explanation. If you would like to teach us instead of our current teacher it would be much appreciated! :P

Umang Gupta · Accepted Answer · 2018-06-08 16:36:47Z

0

One way to do this would be:

var rows = parseInt(prompt("choose end number"))
var i 
var j 
var count = 1

for (i = 1; i <= rows; i++)
{
             for(j=1; j<=i; j++)
             {
             document.write(count + " ");
             count  = count +1
             }
document.write("<br>");
}

I have simply added a count variable and incrementing it every time you write something. The above solution still doesnot calculate i from end number. See the next solution for that.

Another way: Can we do it with only i and j?

var N = parseInt(prompt("choose end number")) 
rows=1
while(rows*(rows+1)/2 < N){
    rows = rows+1
}
var i
var j 
for (i = 1; i <= rows; i++)
{
             for(j=1; j<=i; j++)
             {
             if (i*(i-1)/2 + j  <= N){
                 document.write(i*(i-1)/2 + j + " ");
             }
             }
document.write("<br>");
}

Till row i-1 we would have printed sum of first i-1 natural numbers. and so instead of printing j you could add sum of first i-1 natural numbers to j

edited Jun 8, 2018 at 16:36

answered Jun 8, 2018 at 16:19

Umang Gupta

16.6k7 gold badges51 silver badges69 bronze badges

5 Comments

MR_ GB Over a year ago

Thanks for your solution, while I get the sequential numbers. The user needs to define the last number in the sequence and not the number of rows. I understand that my first variable is misleading.

Umang Gupta Over a year ago

You can determine i by the end number. If end number is N, then i is first number such that i*(i+1)/2 greater than N. This many number of rows you would need.

Umang Gupta Over a year ago

@MR_GB Sorry! I think I missed that part. I updated to add that.

MR_ GB Over a year ago

Thanks for updating the answer. It works as I wanted, however it is a more complicated solution (for me) than I was looking for. Another solution given just after yours was much simpler :-)

Umang Gupta Over a year ago

Yeah. no worries. I was trying to give solution with your provided code as backbone.

Collectives™ on Stack Overflow

sequential number triangle with user-defined last number in JAVASCRIPT

2 Answers 2

3 Comments

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related