续集交易-Javascript

续集交易是一种常见的常见的模式，主要用于处理异步行为。在这种模式下，当用户完成一个操作后，需要请求后台服务器返回相关的数据，以方便用户对接下来的操作进行处理。Javascript里可以实现这一模式，具体方法如下：

基本格式

function continuation() {
  // 生成符合续集交易模式的函数
  var _callback = arguments[arguments.length - 1]; // 最后一个参数一定是回调函数
  var _params = Array.prototype.slice.call(arguments, 0, arguments.length - 1);

  // 调用异步方法
  asyncFunction(_params, function(result) {
    _callback(result);
  });
}

// 异步方法
function asyncFunction(params, callback) {
  setTimeout(function() {
    var result = params[0] + params[1];
    callback(result);
  }, 1000);
}

// 调用续集交易
continuation(1, 2, function(result) {
  console.log(result); // 应该输出3
});

解释

首先定义一个续集交易函数，这个函数包含两个参数：参数数组和回调函数。_params 变量获取了函数除了回调函数以外的所有参数，_callback变量则是回调函数本身。接着调用一个异步方法（参见异步编程），用来模拟续集交易。 最后，传入续集交易函数的所有参数会在异步方法中被使用并返回结果，结果会通过回调函数传递给续集交易函数的调用方。

回调地狱

然而，一旦某些操作需要多次进行，很快代码就变得不可读，难以维护，也被称为 “回调地狱”。

// 代码将逐渐失去结构
asyncFunction(params1, function(result1) {
  asyncFunction(params2, function(result2) {
    asyncFunction(params3, function(result3) {
      // ...
      asyncFunction(paramsN, function(resultN) {
        alert('All done!');
      });
    });
  });
});

为了避免这类问题，我们可以使用 Promise 对象 和 async/await 。

Promise

function asyncFunction(params) {
  return new Promise(function(resolve, reject) {
    setTimeout(function() {
      var result = params[0] + params[1];
      resolve(result);
    }, 1000);
  });
}

asyncFunction([1, 2])
  .then(function(result) {
    console.log(result); // 应该输出 3
  });

解释

我们可以将异步方法返回一个 Promise 实例，在异步操作完成后调用 resolve() 函数，将需要传递给回调函数的参数通过Promise实例传递下去。调用方通过链式调用方式，传递解析方法 then() ，得到异步方法返回的结果。

async/await

async function asyncFunction(params) {
  return new Promise(function(resolve, reject) {
    setTimeout(function() {
      var result = params[0] + params[1];
      resolve(result);
    }, 1000);
  });
}

async function main() {
  var result = await asyncFunction([1, 2]);
  console.log(result); // 应该输出 3
}

main();

解释

async函数显式的返回值为Promise , 用户通过await关键字得到async操作返回的结果并使用。

结论

传统的回调函数可能会使代码难以跟踪和了解，异步操作有异步的方式去处理，但是使用 Promise 或 async/await 可以提高代码的可读性和可维护性。