Question

我仍然试图使用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在分配后不会立即提供function createObj (_callback) { var test = new Object(); test.mainPane = $('#mainPane'); if (typeof(_callback) === 'function') { _callback(test); } }。

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

test.mainPane

如果我希望将fitToPage()传递给函数createElems()，该函数调整元素的属性以适合给定的屏幕大小，然后想要将元素传递给另一个函数$(document).ready(function () { createObj(function (test) { fitToPage(test, function (test) { createElems(test, null); }); }); });这会让孩子们加入元素，事情开始分崩离析：

{{1}}

如果我试图通过创建特殊功能来避免这个回调地狱（？）似乎变得更糟，这些功能除了帮助我管理对其他功能的回调之外什么都不做。我确信我错过了重要的事情，但我们没有想出正确的搜索条件来找到它。有更好的方法吗？

Answer 1

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

目前处理此问题的一种比较流行的方法是Promises。这些实际上并没有消除回调问题，但它们允许您在语法上以更简单的方式处理它们。这个想法是，一个函数不是接受回调，而是返回一个对象，调用者可以将该对象附加到稍后将被处理的回调。在promise库中，这些对象必须公开then方法，该方法需要success和error回调。我不知道jQuery的ready方法是否暴露了它，所以这可能不太正确，但它应该接近你如何用Promises重写你的例子：

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

如果您的createElems版本部分应用了null，则最后一行可能只是

    .then(createElems2);

Answer 2

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);

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

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

2 个答案: