如何深入解析JS前端中常见的竞态问题及解决方案？

本文共计351个文字，预计阅读时间需要2分钟。

目录- 什么是竞态问题？- 取消过期的请求- XMLHttpRequest 取消请求- fetch API 取消请求- axios 取消请求- 可取消的请求的 Promise- 忽略过期的请求- 封装指令式 Promise- 使用唯一 id 标识每次请求- 取消和忽略的区别

目录

• 什么是竞态问题
• 取消过期请求
• XMLHttpRequest 取消请求
• fetch API 取消请求
• axios 取消请求
• 可取消的 promise
• 忽略过期请求
• 封装指令式 promise
• 使用唯一 id 标识每次请求
• 「取消」和「忽略」的比较
• 「取消」更实际
• 「忽略」更通用
• 总结

什么是竞态问题

竞态问题，又叫竞态条件（race condition），它旨在描述一个系统或者进程的输出依赖于不受控制的事件出现顺序或者出现时机。

此词源自于两个信号试着彼此竞争，来影响谁先输出。

简单来说，竞态问题出现的原因是无法保证异步操作的完成会按照他们开始时同样的顺序。举个