为什么这段代码会导致无限循环/递归？

Question

我有以下JavaScript代码：

var original_selectCallback = window.selectCallback;
var selectCallback = function(variant, selector) {
  original_selectCallback(variant, selector);
  console.log(variant + " " + selector);
};

不知怎么搞的，第二行：

var selectCallback = function(variant, selector) 

导致一个对selectCallback的递归调用。我的理解是我正在重新定义selectCallback函数。那么为什么会出现递归调用呢？ 任何建议和建议都将不胜感激。

- Yeo Eng Guan

---

我看不到你的问题？ - Álvaro Touzón

代码应该第一次就能运行，但在刷新页面后会失败。您刷新了页面吗？ - Nikhil Aggarwal

除非 selectCallback 最初已经在调用自身并期望返回值或某些东西来停止递归，否则它不是递归的。 - plalx

你能否包含 window.selectCallback 的原始定义？ - David Hedlund

你忘记了你的问题吗？ - plalx

Answer 1

你发布的代码本身没有任何问题：

var selectCallback = function() { console.log('original'); };
var original_selectCallback = selectCallback;
var selectCallback = function() {
 original_selectCallback();
 console.log('wrapper');
};
selectCallback();

错误很可能在window.selectCallback的初始定义中，此处未显示。

- David Hedlund

Answer 2

这里没有递归，这很容易证明：

let someFn = function () { console.log('original'); };
let originalSomeFn = someFn;

someFn = function () {
  originalSomeFn();
  console.log('decorated');
};

someFn();

然而，原始函数可能在递归算法中使用，你的包装函数可能无法完全履行原始函数的适当行为契约。

为确保正确性，以下是应该包装原始函数的方法。我还选择使用闭包来避免全局变量originalSomeFn。

let someFn = function () {
    console.log('original');
    return 1;
};

someFn = (function (originalSomeFn) {
  return function () {
    let result = originalSomeFn.apply(this, arguments);

    console.log('decorated');

    return result;
  };
})(someFn);

console.log(someFn());

- plalx

Answer 3

让我们检查你的代码：

var original_selectCallback = window.selectCallback;

创建一个新变量，它引用函数selectCallback。

---

var selectCallback = function(variant, selector) {

创建 window.selectCallback 函数（因为它在 window 作用域中）。

---

现在是函数的内部部分

original_selectCallback(variant, selector);

将调用window.original_selectCallback，它与window.selectCallback相同，即您现在所在的同一函数。

因此，您使用永不结束的selectCallback进行递归。

- Justinas