TL&DR：我们在这里发明了可取消的承诺。
嗯.. 好的。一些基础设施。这是一个典型的例子，你真的需要Promise.cancel() 但是我们在 ES6 原生 Promise 中没有它。作为一个与图书馆无关的人，我只是继续通过 Promise 子类发明一个。
以下函数接受一个承诺，并通过添加一个名为 __cancelled__ 的不可枚举且不可配置的属性使其可取消它还在其属性链中添加 .then() 和 .cancel() 方法，而无需修改 Promise.prototype。因为cancellable promise object的proptotype的原型是Promise.prototype，所以我们的cancellable promise可以访问所有Promise的东西。啊..在我忘记之前；可取消原型的then 方法也返回一个可取消的承诺。
function makePromiseCancellable(p){
Object.defineProperty(p,"__cancelled__", { value: false,
writable: true,
enumerable: false,
configurable: false
});
Object.setPrototypeOf(p,makePromiseCancellable.prototype);
return p;
}
makePromiseCancellable.prototype = Object.create(Promise.prototype);
makePromiseCancellable.prototype.then = function(callback){
return makePromiseCancellable(Promise.prototype.then.call(this,function(v){
!this.__cancelled__ && callback(v);
}.bind(this)));
};
makePromiseCancellable.prototype.cancel = function(){
this.__cancelled__ = true;
return this;
};
所以我们有一个名为getAsyncData() 的实用函数，它返回一个标准的 ES6 承诺，在 2000 毫秒内解析。我们将从这个函数中获得两个 Promise，并将它们转换为可取消的 Promise，称为 cp0 和 cp1。然后我们将在 1000 毫秒时取消cp0，看看会发生什么。
function getAsyncData(){
var dur = 2000;
return new Promise((v,x) => setTimeout(v.bind(this,"promise id " + pid++ + " resolved at " + dur + " msec"),dur));
}
function makePromiseCancellable(p){
Object.defineProperty(p,"__cancelled__", { value: false,
writable: true,
enumerable: false,
configurable: false
});
Object.setPrototypeOf(p,makePromiseCancellable.prototype);
return p;
}
makePromiseCancellable.prototype = Object.create(Promise.prototype);
makePromiseCancellable.prototype.then = function(callback){
return makePromiseCancellable(Promise.prototype.then.call(this,function(v){
!this.__cancelled__ && callback(v);
}.bind(this)));
};
makePromiseCancellable.prototype.cancel = function(){
this.__cancelled__ = true;
};
var pid = 0,
cp0 = makePromiseCancellable(getAsyncData());
cp1 = makePromiseCancellable(getAsyncData());
cp0.then(v => console.log(v));
cp1.then(v => console.log(v));
setTimeout(_ => cp0.cancel(),1000);
哇..！极好的。 cp1 在 2000 毫秒时解析，而 cp0 在 1000 毫秒时被取消。
现在，由于我们现在拥有基础架构，我们可以使用它来解决您的问题。
以下是我们将要使用的代码；
function getAsyncData(){
var dur = ~~(Math.random()*9000+1001);
return new Promise((v,x) => setTimeout(v.bind(this,"promise id " + pid++ + " resolved at " + dur + " msec"),dur));
}
function runner(fun,cb){
var promises = [];
return setInterval(_ => { var prom = makePromiseCancellable(fun());
promises.push(prom);
promises[promises.length-1].then(data => { promises.forEach(p => p.cancel());
promises.length = 0;
return cb(data);
});
},1000);
}
var pid = 0,
sid = runner(getAsyncData,v => console.log("received data:", v));
setTimeout(_=> clearInterval(sid),60001);
这是非常基本的。 runner() 函数正在完成这项工作。它通过调用getAsyncData() 每 1000 毫秒请求一个承诺。 getAsyncData() 函数不过这次会给我们一个承诺，它将在 1~10 秒内解决。之所以如此，是因为我们希望后来的一些承诺能够解决，而之前收到的一些承诺仍处于未解决状态。就像你的情况一样。好的;在使收到的承诺可取消后，runner() 函数将其推入promises 数组。只有在将 promise 推送到 promises 数组之后，我们才会将 then 指令附加到它上面，因为我们希望数组只保存主要的 promise，而不是从 then 阶段返回的那些。哪个承诺首先解决并调用它的 then 方法，将首先取消数组中的所有承诺，然后清空数组；只有在那之后才会调用提供的回调函数。
现在让我们看看整个过程。
function makePromiseCancellable(p){
Object.defineProperty(p,"__cancelled__", { value: false,
writable: true,
enumerable: false,
configurable: false
});
Object.setPrototypeOf(p,makePromiseCancellable.prototype);
return p;
}
makePromiseCancellable.prototype = Object.create(Promise.prototype);
makePromiseCancellable.prototype.then = function(callback){
return makePromiseCancellable(Promise.prototype.then.call(this,function(v){
!this.__cancelled__ && callback(v);
}.bind(this)));
};
makePromiseCancellable.prototype.cancel = function(){
this.__cancelled__ = true;
return this;
};
function getAsyncData(){
var dur = ~~(Math.random()*9000+1001);
return new Promise((v,x) => setTimeout(v.bind(this,"promise id " + pid++ + " resolved at " + dur + " msec"),dur));
}
function runner(fun,cb){
var promises = [];
return setInterval(_ => { var prom = makePromiseCancellable(fun());
promises.push(prom);
promises[promises.length-1].then(data => { promises.forEach(p => p.cancel());
promises.length = 0;
return cb(data);
});
},1000);
}
var pid = 0,
sid = runner(getAsyncData,v => console.log("received data:", v));
setTimeout(_=> clearInterval(sid),60001);
如果您不停止 runner 函数，它将无限期地运行。所以在 60001 毫秒时，我通过 clearInterval() 清除它。在此期间，将收到 60 个 promise，只有第一个解析器会通过取消当前收到的所有 previous 的 promise 来调用提供的回调，包括仍然未解析的，在我们的 @ 中第一个解析 promise 之后收到的那些987654349@ 数组。然而，由于这些后来的承诺预计将包含更多新数据，因此可能希望保持它们不被取消。那么我想以下代码中的小改动会在使用最新数据更频繁地刷新屏幕方面做得更好。
function makePromiseCancellable(p){
Object.defineProperty(p,"__cancelled__", { value: false,
writable: true,
enumerable: false,
configurable: false
});
Object.setPrototypeOf(p,makePromiseCancellable.prototype);
return p;
}
makePromiseCancellable.prototype = Object.create(Promise.prototype);
makePromiseCancellable.prototype.then = function(callback){
return makePromiseCancellable(Promise.prototype.then.call(this,function(v){
!this.__cancelled__ && callback(v);
}.bind(this)));
};
makePromiseCancellable.prototype.cancel = function(){
this.__cancelled__ = true;
return this;
};
function getAsyncData(){
var dur = ~~(Math.random()*9000+1001);
return new Promise((v,x) => setTimeout(v.bind(this,"promise id " + pid++ + " resolved at " + dur + " msec"),dur));
}
function runner(fun,cb){
var promises = [];
return setInterval(_ => { var prom = makePromiseCancellable(fun());
promises.push(prom);
promises[promises.length-1].then(data => { var prix = promises.indexOf(prom);
promises.splice(0,prix)
.forEach(p => p.cancel());
return cb(data);
});
},1000);
}
var pid = 0,
sid = runner(getAsyncData,v => console.log("received data:", v));
setTimeout(_=> clearInterval(sid),60001);
当然可能有一些缺陷。我想听听你的想法。