javascript count present i value with previous loop output value

Question

function myFunction() {
  var text = "";
  var i;
  for (i = 0; i <= 10; i++) {
    text += + i + "<br>";
  }
  document.getElementById("demo").innerHTML = text;
}

<button onclick="myFunction()">Count</button>

<p id="demo"></p>

I want to add present i value into previous loop output value. This maybe a simple question. I have searched in google and stackoverflow. But, didn't get the desired result.

In above screenshot,

0 is the previous loop value + 1 is present i returns => 1
1 is the previous loop value + 2 is present i returns => 3
3 is the previous loop value + 3 is present i returns => 6
6 is the previous loop value + 4 is present i returns => 10

CertainPerformance · Accepted Answer · 2019-03-01 22:50:52Z

You need another persistent variable that keeps track of the last total that was concatenated with text:

function myFunction() {
  var text = "";
  var i;
  var lastTotal = 0;
  for (i = 0; i <= 10; i++) {
    var newTotal = lastTotal + i;
    text += + newTotal + "<br>";
    lastTotal = newTotal;
  }
  document.getElementById("demo").innerHTML = text;
}

<button onclick="myFunction()">Count</button>

<p id="demo"></p>

(technically, you don't need the newTotal variable, but it makes the code's intent more clear)

You could also do this a bit more elegantly with reduce:

function myFunction() {
  let text = '';
  Array.from({ length: 11 }, (_, i) => i)
    .reduce((lastTotal, i) => {
      const newTotal = lastTotal + i;
      text += newTotal + '<br>';
      return newTotal;
    }, 0);
  document.getElementById("demo").innerHTML = text;
}

<button onclick="myFunction()">Count</button>

<p id="demo"></p>

Scott Marcus · Accepted Answer · 2019-03-01 22:52:19Z

1

You just need a second variable to hold the last value:

function myFunction() {
  var text = "";
  var sum = 0;
  for (var i = 0; i <= 10; i++) {
    sum += i;
    text += sum + "<br>";
  }
  document.getElementById("demo").innerHTML = text;
}

<button onclick="myFunction()">Count</button>

<p id="demo"></p>

answered Mar 1, 2019 at 22:52

Scott Marcus

66k6 gold badges54 silver badges81 bronze badges

Comments

Jack Bashford · Accepted Answer · 2019-03-01 22:53:10Z

1

Keep a count of the last number:

function myFunction() {
  var text = "";
  var i;
  var count = 0;
  for (i = 0; i <= 10; i++) {
    count += i;
    text += count + "<br>";
  }
  document.getElementById("demo").innerHTML = text;
}

<button onclick="myFunction()">Count</button>

<p id="demo"></p>

answered Mar 1, 2019 at 22:53

Jack Bashford

44.3k11 gold badges56 silver badges84 bronze badges

Comments

Ele · Accepted Answer · 2019-03-01 23:02:01Z

1

You can use the function reduce to fill the operations and then use the function forEach to build the desired output.

function myFunction() {
  var html = "";
  Array.from({length: 10}, (_, i) => i + 1).reduce((a, c, i) => {
    a[i] = (a[i - 1] || 0) + c;
    return a;
  }, []).forEach((n, i, arr) => 
    (html += (arr[i - 1] || 0) + " + " + (i + 1) + " = " + n + "<br>"));

  document.getElementById("demo").innerHTML = html;
}

<button onclick="myFunction()">Count</button>

<p id="demo"></p>

answered Mar 1, 2019 at 23:02

Ele

33.8k7 gold badges43 silver badges80 bronze badges

Comments

ziggy wiggy · Accepted Answer · 2019-03-01 23:18:36Z

1

I think I'd just use an array so that you both have the previous sum, and can also use it with .join() for setting the HTML.

function myFunction() {
  for (var i = 0, a = []; i <= 10; i++) {
    a[i] = i + (a[i-1] || 0);
  }
  
  document.getElementById("demo").innerHTML = a.join("<br>");
}

<button onclick="myFunction()">Count</button>

<p id="demo"></p>

answered Mar 1, 2019 at 23:18

ziggy wiggy

1,0777 silver badges6 bronze badges

Collectives™ on Stack Overflow

javascript count present i value with previous loop output value

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related