JavaScript:使用回调来控制程序流

JavaScript: using callbacks to control program flow

本文关键字：控制 程序 回调 JavaScript      更新时间：2023-09-26

我仍在尝试使用JS进行定向，最近在理解回调的作用方面遇到了很多困难。

我可以看到回调提供了一种更异步（？）的方式来返回函数中生成的值。例如，这对我来说很有意义：

function summation (a, b, _callback) {
 if (typeof(_callback) === 'function') {
  _callback(a+b);
 }
}
$(document).ready(function () {
 summation(2,3,function (_val) {
  console.log(_val);
 }
});

与var _val = summation(2,3);相反，var不能在分配后立即可用。

当我试图用jQuery操作网页上的元素时，我很难使这个过程具有规模。我有一个跟踪元素的对象：

function createObj (_callback) {
 var test = new Object();
 test.mainPane = $('#mainPane');
 if (typeof(_callback) === 'function') {
  _callback(test);
 }
}

如果我想将test.mainPane传递给函数fitToPage()，该函数调整元素的属性以适应给定的屏幕大小，然后想将元素传递给另一个函数createElems()，该函数为元素添加子元素，那么事情就开始分崩离析：

$(document).ready(function () {
 createObj(function (test) {
  fitToPage(test, function (test) {
   createElems(test, null);
  });
 });
});

如果我试图通过创建特殊函数来避免这种回调地狱（？），而这些函数只会帮助我管理对其他函数的回调，那么情况似乎只会变得更糟。我确信我错过了一些重要的东西，但还没有找到正确的搜索词。有更好的方法吗？

您遇到了使用回调处理异步代码所涉及的一个主要问题。异步性具有传染性。一旦你开始在一个地方使用它，周围的代码也需要它，然后是周围的代码，以此类推

目前处理这一问题的一种更流行的方法是Promises。这些实际上并不能消除回调问题，但它们可以让您以更简单的语法方式处理它们。其思想是，函数不接受回调，而是返回一个对象，调用者可以将稍后处理的回调附加到该对象。在promise库中，这些对象必须公开一个接受success和error回调的then方法。我不知道jQuery的ready方法是否公开了它，所以这可能不太正确，但它应该接近于使用Promises:重新修改示例的方式

$(document).ready()
    .then(createObj)
    .then(fitToPage)
    .then(function(test) {return createElems(test, null)});

如果你有一个部分应用了null的createElems版本，那么最后一行可能只是

    .then(createElems2);

JavaScript执行模型在设计上是同步的。因此，如果您在代码中有函数调用，函数体将立即、同步地执行，而不会被其他任务中断。因此，这个

function summation(a,b) {
  return a + b;
}
var r = summation(1,2); // -> 3

将在写入时执行。

同时，当某个事件发生时，您可以要求浏览器运行时环境回调您的函数（回调本身）。因此，您的函数将被异步调用：

function doSomethingWhenDocumentIsLoaded() 
{
  // document ready, do something with it.
}
$(document).ready(doSomethingWhenDocumentIsLoaded);

在这里，我们定义了函数，并要求运行时在文档加载/准备好操作时回调该函数。

相关文章：