承诺和 MatchMedia 订单

【问题标题】：Promises and MatchMedia order承诺和 MatchMedia 订单
【发布时间】：2019-10-26 19:06:04
【问题描述】：

我有这样的代码和平：

const mql = window.matchMedia('(min-width: 400px)');
mql.addListener(e => {
     if (e.matches)
          console.log('Match!');
});

Promise.resolve('Resolved').then(console.log);

当我在 Chrome 上执行它时，输出是“已解决”并且在“匹配”之后。但是在 Firefox 上，情况正好相反。

我不明白为什么不一样？是否可以强制执行顺序？

【问题讨论】：

标签： javascript browser promise matchmedia

【解决方案1】：

根据事件循环规范，微任务在任何渲染回调之前执行。不幸的是，没有一个浏览器符合规范。 Chrome 是最接近的，这就是为什么首先执行作为微任务的 Promise。 Firefox 不符合规范。

您可以查看此链接以获取有关事件循环https://github.com/atotic/event-loop的更多信息和差异@

根据经验，永远不要依赖执行顺序，除非您对相同类型的事件有回调。

【讨论】：