简体   繁体   English

为什么此for循环不起作用?

[英]Why doesn't this for loop work?

Why does these codes crush when i don't use var theLength in for loop? 当我在for循环中不使用var theLength时,为什么这些代码会崩溃? Why do i need to assign x.length to var theLength and use it in for loop to make it work? 为什么我需要将x.length分配给var theLength并在for循环中使用它才能使它工作? thanks, *nothing wrong with my question, stop putting my question on hold. 谢谢,*我的问题没有错,请不要搁置我的问题。 someone is trying to learn. 有人试图学习。

  <html>
        <head>
            <script>
                window.onload= test;

                function test(){
                    var x=document.getElementsByTagName('*');
                    var theLength=x.length;
                    for(var i=0; i<x.length; i++){ // this i<x.length won't work
                                                 // But it will work with i<theLength
                        document.write("Hello World!<br>");
                    }
                }
            </script>
        </head>
        <body>  
        </body>
    </html>

It's working in both cases. 在两种情况下都有效。 But when you assign 但是当你分配

var theLength=x.length;

It's constant for whole loop. 对于整个循环,它是恒定的。 When you use x.length after each document write the value is increased by one. 在每个文档写入后使用x.length时,该值将增加一。 So loop is just endless. 因此循环是无止境的。

Take this example: 举个例子:

x = document.getElementsByTagName('*'); // x.length = 5
theLength = x.length; // theLength = 5

for(var i = 0; i < x.length; i++) {

    document.write('hello');

    // after the first write(), x.length = 1
    // JavaScript is now confused of the new x.length value
}

The error happens because you are changing the value of x.length by writing to the document. 发生错误是因为您正在通过写文档来更改x.length的值。 The value of x will keep changing every time, which JavaScript is smart enough to detect and prohibit. x的值每次都会保持变化,这是一种足以检测和禁止使用的JavaScript。

It works with theLength = x.length because theLength is a constant. 它与theLength = x.length因为theLength是一个常数。

It doesn't work because when you have x.length in the for loop - it's value is constantly increasing as you keep adding new dom elements. 这是行不通的,因为在for循环中有x.length时-随着不断添加新的dom元素,它的值不断增加。 When you set the value before the for loop in the "theLength" variable, it's a fixed value of 4. 在“ theLength”变量中的for循环之前设置值时,它的固定值为4。

So it's definitely not the same thing. 因此,绝对不是同一回事。 If you log the value of x.length inside your for loop you'll see it's value increasing with each iteration of the loop - so you've created an infinite loop! 如果将x.length的值记录在for循环中,您会发现它的值随着循环的每次迭代而增加-因此,您已经创建了一个无限循环!

        window.onload= test;

        function test(){
            var x=document.getElementsByTagName('*');
            var theLength=x.length;
            for(var i=0; i<x.length; i++){
                console.log(" x.length: " + x.length);                    
                document.write("Hello World!<br>");
            }
        }

It's because by writing the <br> tag to the document, you are adding a new Tag. 这是因为通过将<br>标记写入文档,您正在添加新的标记。 So x increases in length while you are in the loop, and thus is an infinite loop. 因此,当您处于循环中时, x的长度会增加,因此是无限循环。

You can try this from the console: 您可以从控制台尝试:

var x=document.getElementsByTagName('*');
x.length
document.write("Hello World!<br>")
x.length // will increase
document.write("Hello World!")
x.length // will stay the same

By assigning var theLength = x.length before you enter the loop, theLength remains the same no matter that you are adding additional tags. 通过在进入循环之前分配var theLength = x.length ,无论您要添加其他标签, theLength保持不变。 Hence the difference in behavior. 因此,行为上的差异。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM