なぜ出力に2番目の変数が適用されないのですか

Question

変数txtが10になっても、それが戻ってくるときにステートメントに適用されないのはなぜですか？変数を10に設定すると、ループが戻ってくるときに出力に適用されませんか？それは、各サイクル後にリセットされていないので、

function myFunction() { 
 
    var myNumber = 2; 
 
    var txt = 10; 
 
    while (myNumber != Infinity) { 
 
     myNumber = myNumber * myNumber; 
 
     txt = txt + myNumber + "<br>"; 
 
    } 
 
    document.getElementById("demo").innerHTML = txt; 
 
}

<button onclick="myFunction()">Try it</button> 
 

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

Answer 1

変数はループの繰り返しごとに変わります。

はのは、反復ごとに値を追跡してみましょう：

上

#1 iteration: txt == 10 + 4 + "<br>" == "14<br>"

#2 iteration: txt == "14<br>" + 16 + "<br>" == "14<br>16<br>"

#3 iteration: txt == "14<br>16<br>" + 256 == "14<br>16<br>256"

そしてそう。また、反復ごとに<p>のHTMLコードを完全に変更します（例：append）。基本的に変数txtは繰り返しごとに変化し、最後の値を表示します<p>

Answer 2

あなたvar txt = 10は、whileループの内側ではありません。

は、ここに私のコードです。私はあなたの質問は、あなたがwhileループを実行するたびにtxt = 10を持っていることを意味していることを意味しますが、myNumberが増分します。その場合、次のようにコードを単純化することができます：

function myFunction() { 
    var myNumber = 2; 
    while (myNumber != Infinity) { 
     myNumber = myNumber * myNumber; 
     var txt = 10 + myNumber + "<br>"; 
    } 
    document.getElementById("demo").innerHTML = txt; 
} 

Answer 3

私は問題があなたがtxtに追加していると思います。私が正しく理解していれば、これで問題は解決します。

function myFunction() { 
var myNumber = 2; 
var txt = 10; 
var output = ""; 
while (myNumber != Infinity) { 
    myNumber = myNumber * myNumber; 
    txt = txt + myNumber; 
    output = output + txt + "<br>"; 
} 
document.getElementById("demo").innerHTML = output; 
} 

Answer 4

var textは値10を保持し、最初の繰り返しで設定された文字列の値が再割り当てされます。

あなたがtxtをログアウトした場合、これはあなたが各繰り返しで見るものです：

// 1) 14 
// Effectively '14<br>` 
// A result of 10 + (2*2) + <br> 

// 2) 14 
// 16 
// Effectively '14<br>16<br>` 
// This is because txt was '14<br>` 
// So '14<br>` + (4*4) + <br> 

// 3) 14 
// 16 
// 256 
// Effectively '14<br>16<br>256<br>` 
// This is because txt was '14<br>16<br>` 
// So '14<br>16<br>` + (16*16) + <br> 

のように...