promise链需显式传递对象以维持上下文，如{user, timestamp}逐级扩展；async/await更直观；可封装contextchain类复用；须避免丢弃返回值、箭头函数隐式返回错误及异常未捕获。
Promise 链本身不自动维护“上下文”，但可以通过 显式传递对象或结构化数据，在每一步中读取、修改并返回更新后的值，从而模拟上下文的延续与变更。
用单个对象贯穿整个 Promise 链
最直接的方式是让每个 then 接收一个包含当前状态的对象（比如 { data, meta, config }），处理后返回新对象。这样数据不会丢失，也能被后续步骤继续使用或扩展。
示例：
fetch('/api/user')
.then(res => res.json())
.then(user => ({ user, timestamp: Date.now() })) // 加入时间戳
.then(ctx => fetch(`/api/posts?uid=${ctx.user.id}`))
.then(res => res.json())
.then(posts => ({ ...ctx, posts })) // 注意：这里 ctx 已不可用！需改写为链式闭包或用 async/await
⚠️ 上面最后一行会报错——因为 ctx 不在作用域内。正确做法是把上下文作为返回值逐级传递：
fetch('/api/user')
.then(res => res.json())
.then(user => ({ user, timestamp: Date.now() }))
.then(ctx =>
fetch(`/api/posts?uid=${ctx.user.id}`)
.then(res => res.json())
.then(posts => ({ ...ctx, posts }))
)
.then(ctx =>
fetch(`/api/profile/${ctx.user.id}`)
.then(res => res.json())
.then(profile => ({ ...ctx, profile }))
)
.then(console.log);
用 async/await + 普通变量更清晰地管理上下文
相比纯 Promise 链，async/await 让上下文变量自然存在，可读性高、不易出错：
async function loadUserProfile() {
const user = await (await fetch('/api/user')).json();
const ctx = { user, timestamp: Date.now() };
ctx.posts = await (await fetch(`/api/posts?uid=${user.id}`)).json();
ctx.profile = await (await fetch(`/api/profile/${user.id}`)).json();
return ctx;
}
封装成可复用的上下文处理器（高级技巧）
如果多个流程都需要类似能力，可以抽象一个 ContextChain 工具类，内部维护一个状态对象，并支持 use 注册异步处理器：
class ContextChain {
constructor(initial = {}) {
this.ctx = initial;
}
use(fn) {
return new Promise(resolve => {
fn(this.ctx)
.then(result => {
this.ctx = { ...this.ctx, ...result };
resolve(this);
});
});
}
value() { return this.ctx; }
}
// 使用：
new ContextChain({ traceId: 'abc123' })
.use(ctx => fetch(`/api/user?tid=${ctx.traceId}`).then(r => r.json()).then(u => ({ user: u })))
.use(ctx => fetch(`/api/order?uid=${ctx.user.id}`).then(r => r.json()).then(o => ({ orders: o })))
.value()
.then(console.log);
避免常见陷阱
-
不要在 then 中丢弃上一步返回值：如果某步没返回东西，后续
then的参数就是undefined -
慎用箭头函数隐式返回对象：写
() => { return { a: 1 }; }没问题，但() => { a: 1 }实际返回undefined（因为花括号被解析为代码块） -
错误处理要统一：建议在链末尾加
.catch()，或每步都用try/catch（配合 async/await）捕获局部异常
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
