当另一个函数在JavaScript中启动或结束时执行语句

我有一个加载器

<div id="loading">Loading..!</div>
<script>$('#loading').hide();</script>

。。。。 ..

---

我希望自动显示加载程序，而不是将该语句写入每个函数。

如果您使用的是ajax jQuery函数，则可以声明全局ajax配置 像这样

$.ajaxSetup({
    beforeSend: function() {
        $('#loading').show();
    },
    complete: function() {
        $('#loading').hide();
    }
});

这样，您可以在每次asyncronus调用启动时显示加载指示器，并在调用结束时隐藏它

---

我希望这有助于

您可以编写一个函数来装饰其他函数

在ES6中

function showAndHide(func) {
  return (...args) => {
    $('#loading').show();

    func(...args);

    $('#loading').hide();
  };
}

const myFunc = showAndHide(() => {
   //blah blah
});

还是ES5

function showAndHide(func) {
  return function decoratedShowAndHide() {
    $('#loading').show();

    func.apply(this, arguments);

    $('#loading').hide();
  };
}

var myFunc = showAndHide(function () {
   //blah blah
});

---

showAndHide

函数接受函数作为参数并返回函数。因此，它可以装饰函数的执行并提供重用。

如注释中所述，您现在遵循的是更清晰的方式，但如果您仍然希望将其他行应用于现有函数，您可以使用它，就像我在下面的

applier

函数中所做的那样：

函数应用程序（initialFunction）{
返回函数（）{
警报（“主逻辑之前的应用部分”）；
var result=initialFunction.apply（这是参数）；
警报（“主逻辑后的应用部分”）；
};
}
func1=函数（）{
警报（“func1，来自主功能的逻辑”）；
}
func2=函数（）{
警报（“func2，来自主功能的逻辑”）；
}
var newFunc1=应用程序（func1）；
var newFunc2=应用程序（func2）；
newFunc1（）；
newFunc2（）我想说你的方法是正确的。这种方式可以清楚地了解正在发生的事情，而且有两条重要的线路并不是那么不方便。为了执行一行而进行一些函数检测是一项非常复杂的工作，几乎没有任何收获。您的函数是否使用async/await？如果是，请在示例中说明。否则，如果它们同步执行，则没有必要尝试显示和隐藏加载程序，因为浏览器在函数完成之前不会重新绘制，另外一个问题是，这些显示和隐藏是否包装了异步操作，以及这些代码在同步执行中是否可以工作。
function showAndHide(func) {
  return (...args) => {
    $('#loading').show();

    func(...args);

    $('#loading').hide();
  };
}

const myFunc = showAndHide(() => {
   //blah blah
});

function showAndHide(func) {
  return function decoratedShowAndHide() {
    $('#loading').show();

    func.apply(this, arguments);

    $('#loading').hide();
  };
}

var myFunc = showAndHide(function () {
   //blah blah
});