Question

要修复仅在Firefox中出现的错误，我需要使用loaded的{{1}}承诺。我目前使用以下代码：

＆＃13;

FontFace

＆＃13;

这适用于仅支持字体加载API的浏览器。但由于if (document.fonts) { for (var fontFace of document.fonts.values()) { if (fontFace['family'] == fontFamily) { fontFace.loaded.then(doStuff); } } } else { doStuff(); }，Internet Explorer会记录错误并停止JS执行。将代码放在for .. of块中并不起作用，通过try .. catch忽略错误可能会有效，但是非常hacky。

有没有办法迭代IE也支持的window.onerror，或者您是否知道在支持它的浏览器中使用document.fonts.values Promise的更好方法？

Answer 1

我建议

const fontFace = Array.from(document.fonts).find(face => face.family === fontFamily);
if (fontFace) {
  fontFace.loaded.then(doStuff);
}

Array.from从迭代中创建一个数组，然后您可以使用普通Array.prototype.some来检查匹配。

然后，您可以将整个检查简化为

const fontFace = document.fonts &&
  Array.from(document.fonts).find(face => face.family === fontFamily);

if (fontFace) fontFace.loaded.then(doStuff);
else doStuff();

假设你想要运行doStuff，如果没有字体面匹配的话。

Answer 2

不幸的是，当您的代码在不受支持的浏览器中运行时，您无法在代码中使用for-of次迭代。问题是在执行和检查条件之前解析代码时发生错误。

如果您真的想使用for-of，则需要为现代浏览器创建一个特殊的JS包，或者使用Babel处理您的代码以将代码转换为es5兼容。

Answer 3

我用以下代码解决了这个问题：

if (document.fonts) {
     var iter = document.fonts.values();
     do {
         var item = iter.next();
         var fontFace = item.value;
         if (fontFace && fontFace['family'] == fontFamilyStr) {
             fontFace.loaded.then(doStuff);
         }
     } while (!item.done);
} else {
            doStuff();
}

IE不再记录错误，代码在Firefox / Chrome中运行。

Internet Explorer：忽略未知的ES6语法

3 个答案: