高频率请求时如何模拟取消上一个Fetch请求

该方式只是模拟取消上一个Fetch请求

主要方式是利用Promise.race主动抛出处理结果，绕开需要忽略的Fetch请求

let cancel = () => {};

// 当输入内容变化时发起请求
input.oninput = function(ev) {
  let term = ev.target.value;
  console.log(`searching for "${term}"`);

  // 取消上一次请求（实际是绕开上一次的请求结果）
  cancel(); 

  // 用来替换返回的Promise，可自己定义
  const p = new Promise(resolve => cancel = resolve);
  
  Promise.race([p, getSearchResults(term)]).then(results => {
    if (results) {
      console.log(`results for "${term}"`,results);
    }
  });
}


// 真实有效的Promise请求
function getSearchResults(term) {
  return new Promise(resolve => {
    let timeout = 100 + Math.floor(Math.random() * 1900);
    setTimeout(() => resolve([term.toLowerCase(), term.toUpperCase()]), timeout);
  });
}


<input id="search">