js消除异步传染性

首先我们先浅浅了解一下什么是异步传染性，看代码

async function getUser(){
				return await fetch('./data.json').then((res)=>res.json());
			}
			async function m1(){
				return await getUser();
			}
			async function m2(){
				return await m1();
			}
			async function m3(){
				return await m2();
			}
			async function main(){
				const user = await m3()
				console.log(user)
			}
			main()

因为我们在fetch使用了await就必须在async，下面使用await调用的使用也必须要使用async，如果不使用的话无法返回正确的值，只能返回一个promis

function getUser(){
				return  fetch('./data.json').then((res)=>res.json());
			}
			 function m1(){
				return  getUser();
			}
			 function m2(){
				return  m1();
			}
			 function m3(){
				return  m2();
			}
			 function main(){
				const user =  m3()
				console.log(user)
			}
			main()

解决方法

function getUser(){
				return  fetch('./data.json')
			}
			 function m1(){
				return  getUser();
			}
			 function m2(){
				return  m1();
			}
			 function m3(){
				return  m2();
			}
			 function main(){
				const user =  m3()
				console.log(user)
			}
			
			//改变fetch函数的行为
			function run(func){
				let cache = [];//存储缓存结果；
				let i = 0;//表示第几次调用fetch
				const _originalFetch = window.fetch;
				window.fetch = (...args)=>{
					//有缓存的话就交付缓存结果
					if(cache[i]){
						if(cache[i].status === 'fulfilled'){
							return cache[i].data
						}
						else if(cache[i].status === 'rejected'){
							throw cache[i].err
						}
					}
					//没有缓存就定一个，加到缓存中
					const result = {
						status:'padding',
						data:null,
						err:null
					};
					cache[i++] = result;
					//发送情求
					const prom =  _originalFetch(...args).then( res=>res.json()).then(
					res=>{
						result.status = 'fulfilled';
						result.data = res;
						console.log("res--->",res)
					},err=>{
						result.status = 'rejected';
						result.data = err;
						console.log("err--->",err)
					}
					)
					//报错
					throw prom
				};
				try{
					func()
				}catch(err){
					//TODO handle the exception
					if(err instanceof Promise){
						const reRun = ()=>{
							i=0;
							func()
						}
						err.then(reRun,reRun)
					}
				}
				 
			}
			run(main)