为一个 Javascript 个特征创建特征检测（intersectionObserver）

Question

有没有一种方法可以将内置的 javascript 方法存储在变量中，以便在某些浏览器无法使用此方法时设置不同的行为？

我的具体情况是 intersectionObserver，它在 Safari 或旧版 MS 浏览器中不可用。我有一些由此触发的动画，如果 intersectionObserver 不可用，我想将它们关闭。

我想做的基本上是这样的：

var iO = intersectionObserver;

if ( !iO ) {
 // set other defaults
}

我真的不想只为一个功能加载 polyfill 或库吗？

非常感谢

艾米丽

Answer 1

运算符中的广泛用于检测浏览器支持的功能。 JavaScript 功能作为 属性 到 window 对象在全球范围内可用。所以我们可以检查 window 元素是否有 属性.

if("IntersectionObserver" in window){
    /* work with IntersectionObserver */
}
if("FileReader" in window){
    /* work with FileReader */
}

The in operator returns true if the specified property is in the specified object or its prototype chain.
Syntax: prop in object
[source: developer.mozilla.org]

因此您还可以将结果保存在 boolean 变量中，稍后在您的代码中使用它。

var iO = "IntersectionObserver" in window; /* true if supported */

if ( !iO ) {
 // set other defaults
}