发现宝藏
前些天发现了一个巨牛的人工智能学习网站，通俗易懂，风趣幽默，忍不住分享一下给大家。【宝藏入口】。
在 JavaScript 中，使用 Promise 的 then 方法可以链式处理异步操作。如果你想获取多个 then 之后的值，你需要确保返回的是一个 Promise，这样可以继续链式调用 then 来获取最终的结果。你可以通过以下几种方式来获取多个 then 之后的值。
1. 链式使用 then 获取值
每次调用 then 时，它会返回一个新的 Promise，所以你可以在每一个 then 中返回一个值或另一个 Promise，并在后续的 then 中处理这个值。
// 示例1：简单的链式调用
const promise = new Promise((resolve, reject) => {resolve(1);
});promise.then(value => {console.log(value); // 1return value + 1;}).then(value => {console.log(value); // 2return value + 2;}).then(value => {console.log(value); // 4return value + 3;}).then(value => {console.log(value); // 7});
在这个例子中，每个 then 处理前一个 then 返回的值，并将新的值传递到下一个 then 中。
2. 同时等待多个 Promise 使用 Promise.all
如果你想并行地处理多个异步操作，并在所有操作完成后获取它们的值，可以使用 Promise.all。它接受一个 Promise 数组，并返回一个新的 Promise，该 Promise 会在所有输入的 Promise 都成功时解析，或者在任何一个 Promise 失败时被拒绝。
// 示例2：使用 Promise.all 来并行获取多个值
const promise1 = new Promise((resolve) => setTimeout(() => resolve(1), 1000));
const promise2 = new Promise((resolve) => setTimeout(() => resolve(2), 2000));
const promise3 = new Promise((resolve) => setTimeout(() => resolve(3), 3000));Promise.all([promise1, promise2, promise3]).then(values => {console.log(values); // [1, 2, 3]}).catch(error => {console.error(error);});
在这个例子中，Promise.all 会等到所有的 Promise 完成后，返回一个包含每个 Promise 结果的数组。
3. 按顺序处理多个 Promise 使用 reduce
如果你需要按顺序执行多个异步操作，并且每个操作依赖于上一个操作的结果，你可以使用 reduce 来处理多个 Promise。这样每个 then 中返回的值都会作为下一个 then 的输入。
// 示例3：按顺序处理多个 Promise
const promises = [() => new Promise(resolve => setTimeout(() => resolve(1), 1000)),() => new Promise(resolve => setTimeout(() => resolve(2), 2000)),() => new Promise(resolve => setTimeout(() => resolve(3), 3000))
];promises.reduce((prevPromise, currentPromiseFn) => {return prevPromise.then(result => {return currentPromiseFn().then(value => {console.log(result, value); // 打印先前的结果和当前结果return value;});});}, Promise.resolve()) // 初始的 resolved Promise.then(finalResult => {console.log("最后的结果:", finalResult);});
4. 获取多个异步操作的结果并行处理
如果你有多个独立的异步操作，你可能会选择同时执行它们，而不依赖于它们的顺序。这时可以使用 Promise.all 或者 Promise.allSettled。
-
Promise.all：如果所有Promise都成功，返回一个包含所有结果的数组。如果任何一个失败，整个Promise.all会失败。 -
Promise.allSettled：返回所有Promise最终的状态（无论是成功还是失败），并且会返回每个Promise的结果或原因。
// 示例4：同时获取多个 Promise 的结果
const promise1 = new Promise((resolve) => setTimeout(() => resolve("Result 1"), 1000));
const promise2 = new Promise((resolve) => setTimeout(() => resolve("Result 2"), 2000));
const promise3 = new Promise((resolve) => setTimeout(() => resolve("Result 3"), 3000));Promise.all([promise1, promise2, promise3]).then(results => {console.log(results); // ["Result 1", "Result 2", "Result 3"]}).catch(error => {console.log(error);});
或者使用 Promise.allSettled：
Promise.allSettled([promise1, promise2, promise3]).then(results => {console.log(results);/*[{ status: "fulfilled", value: "Result 1" },{ status: "fulfilled", value: "Result 2" },{ status: "fulfilled", value: "Result 3" }]*/});
总结
- 如果你想获取多个
then后的值，可以通过链式then获取每一步的结果。 - 如果你需要多个
Promise同时执行，可以使用Promise.all或Promise.allSettled等方法来处理并发操作，并获取它们的最终结果。 - 使用
reduce可以帮助你按顺序处理多个依赖的异步操作。
每种方法的使用场景取决于你的需求，例如是否需要顺序执行，是否需要并发执行，或者需要处理多个异步操作的成功和失败等情况。
