4
votes

javascript count présente la valeur i avec la valeur de sortie de la boucle précédente

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

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

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

Je veux ajouter la valeur i actuelle dans la valeur de sortie de la boucle précédente. C'est peut-être une question simple. J'ai cherché dans google et stackoverflow. Mais je n'ai pas obtenu le résultat souhaité.

Dans la capture d'écran ci-dessus,

0 est le la valeur de la boucle précédente + 1 est présente i renvoie => 1
1 est la valeur de la boucle précédente + 2 est présent i renvoie => 3
3 est la valeur de la boucle précédente + 3 est présent i renvoie => 6
6 est la valeur de la boucle précédente + 4 est présent i renvoie => 10

javascript html for-loop

0 commentaires

5 Réponses :

4
votes

Vous avez besoin d'une autre variable persistante qui garde la trace du dernier total concaténé avec les données text:

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

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

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;
}

(techniquement, vous n'avez pas besoin de la variable newTotal , mais cela rend l'intention du code plus claire)

Vous pouvez aussi faire un peu plus élégamment avec reduce:

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

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

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;
}

0 commentaires

1
votes

Vous avez juste besoin d'une deuxième variable pour contenir la dernière valeur:

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

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

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

0 commentaires

1
votes

Conservez un décompte du dernier nombre:

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

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

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;
}

0 commentaires

1
votes

Vous pouvez utiliser la fonction réduire pour remplir les opérations, puis utiliser la fonction forEach pour créer la sortie souhaitée.

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

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

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;
}

0 commentaires

1
votes

Je pense que j'utiliserais simplement un tableau pour que vous ayez tous les deux la somme précédente, et que vous puissiez également l'utiliser avec .join () pour définir le HTML.

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

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

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

0 commentaires