本文主要是介绍事件 passive 是什么？，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
passive 是 绑定事件的一个参数，他可以用来改善滚屏(scroll)的性能
根据规范，passive 选项的默认值始终为false。但是，这引入了处理某些触摸事件（以及其他）的事件监听器在尝试处理滚动时阻止浏览器的主线程的可能性，从而导致滚动处理期间性能可能大大降低。
为防止出现此问题，某些浏览器（特别是Chrome和Firefox）已将文档级节点 [Window](<https://developer.mozilla.org/zh-CN/docs/Web/API/Window>)，[Document](<https://developer.mozilla.org/zh-CN/docs/Web/API/Document>)和[Document.body](<https://developer.mozilla.org/zh-CN/docs/Web/API/Document/body>)的[touchstart](<https://developer.mozilla.org/zh-CN/docs/Web/Reference/Events/touchstart>)和[touchmove](<https://developer.mozilla.org/zh-CN/docs/Web/Reference/Events/touchmove>)事件的passive选项的默认值更改为true。这可以防止调用事件监听器，因此在用户滚动时无法阻止页面呈现。
var elem = document.getElementById('elem');
elem.addEventListener('touchmove', function listener() { /* do something */ }, { passive: true });添加passive参数后，touchmove事件不会阻塞页面的滚动（同样适用于鼠标的滚轮事件）。在这里查看demo（需要翻墙）。
**注意：**那些不支持参数options的浏览器，会把第三个参数默认为useCapture，即设置useCapture为true
您可以通过将passive的值显式设置为false来覆盖此行为，如下所示：
/* Feature detection */
/*特诊检测*/
var passiveIfSupported = false;try {window.addEventListener("test", null, Object.defineProperty({}, "passive", { get: function() { passiveIfSupported = { passive: true }; } }));
} catch(err) {}window.addEventListener('scroll', function(event) {/* do something */// can't use event.preventDefault();// 不能使用event.prevebt.
}, passiveIfSupported );
在不支持addEventListener()的options参数的旧浏览器上，尝试使用它会阻止使用useCapture参数而不正确使用特征检测。
您无需担心基本[scroll](<https://developer.mozilla.org/zh-CN/docs/Web/Reference/Events/scroll>) 事件的passive值。由于无法取消，因此事件监听器无法阻止页面呈现。
这篇关于事件 passive 是什么？的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
