javascript for 循环百分比计算每 12 个月

Question

我尝试使用 javascript for 循环计算一些数字。但是，无法得到想要的结果。

例如，基础数量为 10000，百分比为 8。

应该是前 12 个月，

10000 10000 10000 10000 10000 10000 10000 10000 10000 10000 10000 10000

接下来的 12 个月，我必须计算 10000 的 8% 并将其添加到基本数量。 10000 的 8% 是 800。因此，接下来 12 个月的输出是，

10800 10800 10800 10800 10800 10800 10800 10800 10800 10800 10800 10800

接下来的 12 个月，我必须计算 10800 的 8% 并将其添加到之前的基础数量。 10800 的 8% 是 864。因此，接下来 12 个月的输出是，

11664 11664 11664 11664 11664 11664 11664 11664 11664 11664 11664 11664

接下来的 12 个月，我必须计算 11664 的 8% 并将其添加到之前的基础数量。 11664 的 8% 是 933.12。因此，未来 12 个月的产出是，

12597.12 12597.12 12597.12 12597.12 12597.12 12597.12 12597.12 12597.12 12597.12 12597.12 12597.12 12597.12

目前已尝试以下代码，

Javascript

function myFunction() {
    l = 12;
    a = document.getElementById("base").value;
    hk = (a*document.getElementById("per").value)/100;


    for (var i = 0; i < l; i++) {
      if(i % 12 === 0) {
          a = Number(document.getElementById("base").value) + Number(hk);
      }
    }
         document.getElementById("demo").innerHTML += a;


  }

HTML

<div>
    <span>Base</span>
    <input type="text" id="base" value="10000" />
  </div>
  <div>
    <span>Percentage</span>
    <input type="text" id="per" value="8" />
  </div>

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

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

JsFiddle

Answer 1

尝试关注

• 您需要跟踪 a 的更新值，因此，将其移到函数之外
• 在每次点击时，检查a 的值。如果是第一次，从输入字段中选择它，连续点击，您可以从之前执行期间的计算值中选择相同
• 要打印 12 次值，只需循环以准备结果字符串。
• 最后将字符串附加到相应的结果元素中。

var a;
function myFunction() {
  var l = 12;
  a = a || Number(document.getElementById("base").value);
  var hk = (a * document.getElementById("per").value) / 100;
  a += Number(hk);
  var r = "";
  for (var i = 0; i < l; i++) {
      r += a + " ";
  }
  document.getElementById("demo").innerHTML += r + "<br/>";


}

<div>
  <span>Base</span>
  <input type="text" id="base" value="10000" />
</div>
<div>
  <span>Percentage</span>
  <input type="text" id="per" value="8" />
</div>

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

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

您还可以将迭代硬编码在代码中，也可以从 html 中选择，如下所示。

function myFunction() {
  var l = 12;
  var a = Number(document.getElementById("base").value);
  var years = Number(document.getElementById("years").value);
  var r = "";
  for (var i = 0; i < years; i++) {
    if(i) {
      var hk = (a * document.getElementById("per").value) / 100;
      a += Number(hk);
    }
    
    for (var j = 0; j < l; j++) {
      r += a + " ";
    }
    r += "<br/>";
  }
  document.getElementById("demo").innerHTML += r;
}

<div>
  <span>Base</span>
  <input type="text" id="base" value="10000" />
</div>
<div>
  <span>Percentage</span>
  <input type="text" id="per" value="8" />
</div>
<div>
  <span>Years</span>
  <input type="text" id="years" value="4" />
</div>

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

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

Answer 2

刚刚尝试使用 Javascript 来复制输出。 考虑到上部循环是您要计算的依赖次数。

let baseValue = 10000
const basePercent = 0.08
const months = 12
let numberOfYears = 5
let skipFirstYear = false
for(let j = 0; j< numberOfYears; j++ ) {
    if(j === 1) {
     skipFirstYear = true
    }
    if(skipFirstYear) {
      baseValue += baseValue * basePercent
    }
    for(let i = 0; i<months; i++) {
     console.log(baseValue)
    }
}

Answer 3

我想你正在寻找这个

function myFunction() {
  var l = 12;
  var cycle = document.getElementById("cycle").value;
  var a = document.getElementById("base").value;
  var hk = parseFloat((a * document.getElementById("per").value) / 100);
  for (let j = 0; j < cycle; j++) {
    document.getElementById("demo").innerHTML += "<br>For next 12 months<br>"
    a = Number(a) + Number(hk);
    hk = parseFloat((a * document.getElementById("per").value) / 100);
    for (var i = 1; i <= l; i++) {

      document.getElementById("demo").innerHTML += '<br>' + a;

    }
  }
}

<div>
  <span>Base</span>
  <input type="text" id="base" value="10000" />
</div>
<div>
  <span>Percentage</span>
  <input type="text" id="per" value="8" />
</div>
<div>
  <span>Cycles</span>
  <input type="text" id="cycle" value="4" />
</div>

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

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

Answer 4

var a;
function myFunction() {
    l = 12;
    a = a || document.getElementById("base").value;
    hk = (a*document.getElementById("per").value)/100;

    for (var i = 0; i < l; i++) {
      	document.getElementById("demo").innerHTML += ' ' + a;
    }
    a = Number(a) + Number(hk);
    document.getElementById("demo").innerHTML += '<br>'

  }
  
  function call() {
      b = document.getElementById("cycles").value;
      if (b) {
        for (var i = 0; i < b; i++) {
          myFunction();
        }
      } else {
        myFunction();
      }
  }

<div>
    <span>Base</span>
    <input type="text" id="base" value="10000" />
  </div>
  <div>
    <span>Percentage</span>
    <input type="text" id="per" value="8" />
  </div>
  <div>
    <span>Years</span>
    <input type="text" id="cycles" value="4" />
  </div>
  
  <button onclick="call()">Click</button>
  
  <p id="demo"></p>