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?

Answer 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>");
    }

Answer 2

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