在小程式開發的時候提醒

[Violation] Added non-passive event listener to a scroll-blocking 'touchstart' event. Consider marking event handler as 'passive' to make the page more responsive.

違反：沒有新增被動事件監聽器來阻止’touchstart’事件，請考慮新增事件管理者’passive’，以使頁面更加流暢。

出現如上提示這可能是由於console的過濾器選擇了Verbose

• Verbose-冗長,就是事無具細的把所有log顯示出來
• Info-顯示開發者自定義的log及錯誤資訊
• Warnings-顯示危險資訊
• Errors-顯示錯誤資訊

一般預設的是Info,不會提示這個提醒，雖然這並不影響程式碼的正常執行，但是既然提醒了還是弄明白是什麼原因的好一些。

問題就是由於之前改動過這個導致的。

這是因為Chrome51版本以後，Chrome增加了新的事件捕獲機制－Passive Event Listeners

Passive Event Listeners 就是告訴前頁面內的事件監聽器內部是否會呼叫 preventDefault 函式來阻止事件的預設行為，以便瀏覽器根據這個資訊更好地做出決策來優化頁面效能。當屬性passive的值為true的時候，代表該監聽器內部不會呼叫preventDefault函式來阻止預設滑動行為，Chrome瀏覽器稱這型別的監聽器為被動（passive）監聽器。目前Chrome主要利用該特性來優化頁面的滑動效能，所以Passive Event Listeners特性當前僅支援mousewheel/touch相關事件

舊版的事件捕獲程式碼如下：

document.addEventListener("click", fn, false/true)

第三個引數決定了fn函式是在冒泡還是捕獲階段觸發。
新版第三個引數不但可以是布林值，還可是一個物件

document.addEventListener("mousewheel", fn, {passive: true})

由於passive物件只在Chrome瀏覽器中支援，所以這裡需要做一個相容處理

var passiveSupported = false;
    try {
        var options = Object.defineProperty
 
({}, "passive", {
            get: function() {
                passiveSupported = true;
            }
        });
        window.addEventListener("test", null, options);
    } catch(err) {}
    function fn() {
        console.log("fn")
    }
    document.addEventListener("mousewheel", fn, passiveSupported ? { passive: true } : false)

再看Chrome除錯會發現，Chrome已經不再出現讓人頭大的提醒。
希望對您學習javascript有所幫助，關了個注唄。