NodeJS - eventTarget.addEventListener() 方法

---

eventTarget.addEventListener() 方法用於在其呼叫的 EventTarget 上新增指定的監聽器。

EventTarget 類在 Node.js 中不可直接使用。相反，您可以使用 events 模組中的 EventEmitter 類來實現類似的功能。

此方法屬於 node:events 模組的EventTarget 類。

語法

以下是 NodeJs eventTarget.addListener() 方法的語法：

eventTarget.addEventListener(type, listener [, options])

引數

此方法具有以下三個引數。

• type：此引數儲存一個字串值，表示要監聽的事件型別。
• listener：當發生指定型別的事件時接收通知的物件。
• options：（可選）
• once：布林值，指示監聽器在新增後最多應被呼叫一次。如果為 true，則在呼叫監聽器後會自動將其移除。
• passive：布林值，如果為 true，則表示監聽器不會呼叫 Event 物件的 preventDefault() 方法。
• capture：布林值，指示此型別的事件將在分派到任何 EventTarget 之前分派給指定的監聽器。這在 Node.js 中沒有直接使用，只是為了 API 的完整性而新增的。
• signal：每當指定的 AbortSignal 物件的 abort() 方法被呼叫時，監聽器將被移除。

返回值

此方法返回事件目標。它允許為一個事件新增多個處理程式，並控制監聽器何時被啟用。

示例 1

以下是 NodeJs eventTarget.addEventListener() 方法的基本示例。

首先，我們匯入了 node:events 模組。然後，我們將帶有事件型別“foo”的監聽器函式傳遞給 eventTarget.addEventListener() 方法。

const { EventEmitter, listenerCount } = require('node:events');

function handler(event){
};

const target = new EventTarget();

target.addEventListener('foo', handler);

輸出

根據以上程式，我們將一個監聽器“handler”新增到事件型別“foo”。

示例 2

在這個程式中，我們正在向 eventTarget.addEventListener() 方法新增兩個帶有事件型別“foo”的監聽器函式。

const { EventEmitter, listenerCount } = require('node:events');

function handler1(event){
};

const handler2 = {
  handleEvent(event) {
    console.log(event.type); // prints foo to the console
  }
};

const target = new EventTarget();

target.addEventListener('foo', handler1);
target.addEventListener('foo', handler2);

輸出

根據以上程式，我們將兩個事件監聽器“handler1”和“handler2”新增到事件型別“foo”。

示例 3

注意：任何指定的監聽器僅向“type”事件新增一次，並且每個“capture”可選引數值。

最初，我們匯入了 node:events 模組。然後，我們為“foo”事件添加了一個單一的監聽器函式“handler”。

const { EventEmitter, listenerCount } = require('node:events');

function handler(event){
};

const target = new EventTarget() 

target.addEventListener('foo', handler, {capture: true});
target.addEventListener('foo', handler, {capture: false});

輸出

根據以上程式，監聽器“handler”可以分別使用 capture: false 值和 capture: true 值新增一次。

示例 4

注意：在 nodejs 中，我們不能直接使用事件目標來生成輸出，我們通常使用 EventEmitter 來處理事件，而不是在瀏覽器中使用的 EventTarget。

在這個例子中，我們使用 EventEmitter 而不是 EventTarget 匯入了 node:events 模組。然後，我們傳遞了一個帶有事件型別“foo”的監聽器函式。on 方法用於新增事件監聽器，emit 方法觸發事件。

const { EventEmitter } = require('events');

function handler(event) {
    console.log('Event received:', event);
}

const target = new EventEmitter();

target.on('foo', handler); 
target.emit('foo', { data: 'Some event data' }); 

輸出

以上程式產生以下輸出：

Event received: { data: 'Some event data' }