为什么我的 javascript 代码进入无限循环？

Question

在下面的代码中，每当我单击提交按钮时，就会打开多个 window，就像它处于无限循环中一样。如果我取消注释警报，那么多个警报会不断弹出，就像它们处于无限循环中一样。为什么会发生这种情况？

<html>
<head>

<script type = "text/javascript">
    var window;

    function moveBy() {
        //alert("-- hello ---");
        window = window.open("http://www.w3schools.com");
        window.moveBy(10, 20);
    }
</script>


</head>
<body>
<input type = "submit" value = "moveBy" onclick = "moveBy()"> </input>
</body>
</html>

Answer 1

因为您从自身调用函数 moveBy。

Answer 2

Javascript 不支持方法重载，所以通过调用 window.moveBy(10, 20); 实际上基本上是再次调用 moveBy()，导致死循环。

从自身调用一个函数被称为recursion。链接的 post 是关于该主题的好读物，它将指导您在哪里可能想要它。但在你的情况下你显然没有。

阅读 this 文章了解更多详情。

为了防止这种情况发生，您可以将 moveBy() 函数重命名为 myMoveBy() 或更好的 openAndMoveBy()

Answer 3

您正在通过在 moveBy 函数中调用 window.moveBy 来创建一个 recursion（调用自身的函数），而没有声明断点或退出情况：

function moveBy() {
    //alert("-- hello ---");
    window = window.open("http://www.w3schools.com");
    window.moveBy(10, 20); //recursion, it will call this function over and over again.
}

也许您想要的是为您的函数使用另一个名称，并使用预定义参数调用实际的 window.moveBy 内部：

function customMoveBy() {
    //alert("-- hello ---");
    window = window.open("http://www.w3schools.com");
    window.moveBy(10, 20);
}

<input type = "submit" value = "moveBy" onclick = "customMoveBy()"> </input>

Answer 4

问题是您在函数 moveBy 中调用函数 moveBy。每当您执行该函数时，您都会一次又一次地调用它 ...

试试这个：

<html>
<head>

<script type = "text/javascript">
    var window;

    function moveBy() {
        alert("-- hello ---");
        window = window.open("http://www.w3schools.com");
        //window.moveBy(10, 20);
    }
</script>


</head>
<body>
<input type = "submit" value = "moveBy" onclick = "moveBy()"> </input>
</body>
</html>

为什么我的 javascript 代码进入无限循环？

Why is my javascript code going into an infinite loop?

javascript

infinite-loop