javascript - 是否可以将 "assign"一个函数转换为另一个函数？

Question

我是编码的新手，正在寻求建议。

我在动画循环中有一组函数，这些函数根据变量值执行。这意味着我实际上是在检查每一帧的值并执行相关函数。

由于变量的值仅在用户输入时发生变化，我正在考虑将 if else - 语句从动画循环中移除。我想知道我是否可以将关联函数“分配”给另一个在循环中运行但能够更改其内容的函数。

对此有什么想法吗？ :-)

Answer 1

JavaScript 中的函数是对象。这意味着变量可以引用函数。¹

因此，如果您有函数 a、b 和 c，您可以有一个 current 变量引用到您当前正在使用的那个，例如，a:

let current = a;

稍后，如果情况发生变化，您可以更新 current 以引用 b:

current = b;

无论哪种方式，您都可以像使用 a 或 b 一样使用 current:

current(/*arguments go here if any*/);

实例:

const btnCall = document.getElementById("btnCall");
let current;

useA();

function a() {
    console.log("Function `a` called");
}

function b() {
    console.log("Function `b` called");
}

function useA() {
    current = a;
    btnCall.value = "Call a";
}

function useB() {
    current = b;
    btnCall.value = "Call b";
}

hook("btnCall", () => {
    current();
});
hook("btnUseA", useA);
hook("btnUseB", useB);

function hook(id, fn) {
    document.getElementById(id).addEventListener("click", fn);
}

<input type="button" value="Call ?" id="btnCall">
<input type="button" value="Use a" id="btnUseA">
<input type="button" value="Use b" id="btnUseB">

Also on CodePen (现在很多人都无法使用代码片段)。

---

¹ 事实上，只要您不使用对象属性来引用函数，您总是在使用“变量”(更准确地说，绑定(bind))来引用功能。当你这样做时:

function example() {
}

...您正在创建一个函数和一个在当前范围内引用该函数的变量。由这样的函数声明创建的变量实际上等同于 var 变量。变量(var、let)、常量(const)和函数参数都是保存值的绑定(bind)，包括对函数等对象的引用。