javascript - 使用功能检测通过点表示法检查对保留字的支持

Question

我正在开发一个仍需要支持 IE8 的网站，并且我们正在尝试包含 Twitter 共享按钮小部件。

在 IE8 中，我们看到“预期标识符”错误。这似乎是一个常见问题，下面的帖子对此进行了充分而良好的解释:

• Twitter widgets.js throws JavaScript error "Expected identifier" on IE8
• Twitter button causing JS error in IE8 (Expected identifier)

基本上 Twitter 已经停止支持 IE8(我希望我也能这样做 ;) ) - 但更重要的是，该错误是由于 Twitter widgets.js 文件似乎引用了名为 delete 的属性而引起的 通过点表示法(这就是我上面引用的第一篇 SO 帖子所建议的)

根据上述 2 篇 SO 帖子，有 2 种解决方法 - 要么获取 widgets.js 的副本，然后将属性名称从 delete 更改为其他名称；或者使用条件注释来阻止它在 IE8 中加载

我不喜欢复制 widgets.js 文件(并且必须永远维护它!)，因此我正在考虑阻止它在 IE8 中加载。但我不想使用条件注释；我想使用特征检测。

所以我尝试编写以下内容，我可以用它来决定是否调用 Twitter 异步库加载代码:

NTJSLibrary.prototype.hostSupportsDeleteKeywordAsPropertyName = function hostSupportsDeleteKeywordAsPropertyName() {
    var testObj = {"delete":true};
    try {
        return testObj.delete;
    }
    catch (e) {
        // Host does not support referencing a property named 'delete' and has thrown an exception
        return false;
    }
};

不幸的是，它不起作用，因为 IE8 抛出 SCRIPT1010 错误，这是一个编译/解释错误，而不是运行时错误。 IE 不会抛出异常，因为它没有运行!

有谁知道如何编写一个特征检测函数来检测通过点表示法引用保留字delete是否会导致编译/解释错误？

Answer 1

之所以不能只用 try-catch 语句来测试它，是因为语法错误是 JavaScript 中的“早期错误”，这意味着错误会立即抛出，甚至不需要尝试执行代码。 (看 What types of errors are caught by try-catch statements in Javascript?以获得更详细的解释。)

为了解决这个问题，我们必须使用某种方法来动态创建代码，这将避免这个问题。在 JavaScript 中，您可以使用 new Function 或 eval 来执行此操作(在本例中，使用 eval 是可以接受的，因为我们不执行用户定义的函数)代码，并且没有真正的方法来使用它)。

测试示例可能如下所示:

function testReservedWords() {
  try {
    new Function('a.delete');
    return true;
  } catch (e) {
    return false;
  }
}