爲什麼兩個不同的javascript事件對待這個函數的方式不同？

Question

我有以下的javascript功能：

onMouseMoved = (function(_this) { 
    console.log(_this) 
    return function(event) { 

     console.log(event) 
     return; 
    }; 
    })(this); 

爲什麼鼠標移動事件trigers

如果我加入這個監聽器：

document.addEventListener('mousemove', onMouseMoved, false); 

console.log(event)獲取的觸發而不是console.log(_this)

但如果我添加此聽衆：

document.addEventListener('mouseenter', onMouseMoved, false); 

這是相反的，爲什麼？

Answer 1

您並未在事件處理函數中調用console.log(this)，那麼您立即調用。這是一個立即調用的函數表達式，或IIFE。它執行並返回一個分配給onMouseMoved的函數。

onMouseMoved = (function(_this) { 
    console.log(_this) 
    return function(event) { 

     console.log(event) 
     return; 
    }; 
    })(this); 

    // console.log(_this) has already bee called at this point 
    // onMouseMoved has been set to the returned function: 
    // 
    // function(event) { 
    // console.log(event) 
    // return; 
    // }; 

    document.addEventListener('mousemove', onMouseMoved, false); 

    document.addEventListener('mousemove', onMouseMoved, false); 

Answer 2

這console.log(_this)只會被調用時onMouseMoved被實例化的第一次。

onMouseMove被定義爲一個函數，立即調用值爲this（可能爲功能範圍的原因）。該控制檯日誌記錄_this不在其事件處理函數內，因此它不會在事件中調用。