如何使用JavaScript在指定时间后实现调用另一个函数的功能

假设我们已经有了一个函数 add() ，它接受两个参数 a 和 b ，并返回它们的和。我们需要实现一个函数，可以在给定的 延迟时间 后调用任何函数。可以使用以下方法实现：

方法一：创建 一个接受延迟时间、要调用的函数以及要传递的参数的函数。

示例： 在这种方法中，我们将 add() 函数以及其参数传递给我们创建的 callAfter() 函数。使用setTimeout()方法，在给定的延迟时间后从callAfter()方法中调用add()函数。还将参数传递给函数。

<script>
    function callAfter(delay, myFunct,
        ...params) {
        setTimeout(() => {
            myFunct(...params);
        }, delay);
    }

    function add(a, b) {
        alert("The sum is : " + (a + b));
    }

    callAfter(2000, add, 4, 7);
</script>

输出：

如何使用JavaScript在指定时间后实现调用另一个函数的功能

方法二： 使用匿名函数。

示例： 在某些情况下，你可能想传递带有参数的函数，但不希望在回调函数被调用之前调用它。在这种情况下，可以将其包装在匿名函数中。

<script>
    function callAfter(delay, funct) {
        setTimeout(() => {
            funct();
        }, delay);
    }

    function add(a, b) {
        alert("The sum is : " + (a + b));
    }

    callAfter(2000, function() {
        add(4, 7);
    });
</script>

输出：

如何使用JavaScript在指定时间后实现调用另一个函数的功能

方法三：使用JavaScript原型： 在这种方法中，我们可以向函数构造函数的原型对象中添加一个方法。这将允许我们在任何函数中使用 callAfter() 。

语法：

functionName.callAfter(delay, param1, param2, ....);

示例： 这个示例展示了上述解释的方法。

<script>
    Function.prototype.callAfter =
        function(delay, ...params) {
            setTimeout(() => this(...params), delay);
        };

    function add(a, b) {
        alert("The sum is : " + (a + b));
    }

    add.callAfter(2000, 4, 7);
</script>