Deno 中如何实现事件驱动？-JavaScript中文网-JavaScript教程资源分享门户

前言

Deno 是近年来相对新颖的一种 JavaScript 运行环境，可以让开发者在运行 JavaScript 代码时不需要安装其他依赖。它采用了类似 Node.js 一样的单线程的非阻塞 I/O 模型，但却没有 Node.js 的一些历史遗留问题（如回调地狱、包管理等）。和 Node.js 不同，Deno 的运行时是由原生 Rust 编写而成，支持 TypeScript，并且安全性是其设计的一个重点。

事件驱动是现代 Web 开发中非常重要的一个概念，它是基于事件的编程模型，通过定义事件监听器来响应特定的事件。这篇文章将会介绍如何在 Deno 中实现事件驱动。

什么是事件驱动？

事件驱动是一种编程模型，它将程序的执行流程分解为事件和事件处理器两个部分，事件指的是用户操作或系统消息等引起的程序执行流程改变，事件处理器则是对这些事件响应的程序逻辑。

事件驱动在 Web 开发中占有重要的地位，例如前端开发中的 DOM 事件处理和后端开发中的网络事件（TCP 连接、HTTP 请求、文件输入/输出等）。

Deno 中的事件

Deno 中的事件包括两个核心部分，分别是事件源和事件监听器。

事件源指的是程序中引起事件的对象，在 Deno 中可以是 WebSocket、HTTP 服务器、文件流等。

事件监听器则是响应事件的逻辑，每个事件源可以注册多个事件监听器，它们会按照注册顺序被执行响应事件的逻辑。

Deno 通过 EventTarget 和 Event 类来实现事件驱动。

`EventTarget` 类

在 Deno 中，所有支持事件驱动的对象都实现了 EventTarget 类。它提供了注册、注销和触发事件的方法。

class EventTarget {
  addEventListener(type: string, listener: EventListener): void;
  removeEventListener(type: string, listener: EventListener): void;
  dispatchEvent(event: Event): boolean;
}

事件监听器是通过 addEventListener 方法注册的，其中 type 参数指定要注册的事件类型，listener 参数为事件处理器函数。

事件监听器可以通过 removeEventListener 方法注销，该方法与 addEventListener 方法相反，用来将某个事件监听器从事件源中移除。

dispatchEvent 方法用于触发事件，该方法接收一个 Event 实例作为参数，并返回一个布尔值，表示是否成功触发事件。

`Event` 类

Event 类用于描述一个事件实例，它包含了事件的类型和与事件相关的数据。在 Deno 中，所有 Event 的子类都可以用于描述特定类型的事件。

class Event {
  readonly type: string;
  readonly target: EventTarget | null;
  cancelBubble: boolean;
  defaultPrevented: boolean;
  readonly timeStamp: number;
}

Event 类包括以下属性：

type：事件的类型。
target：事件的发起者。
cancelBubble：表示事件是否已经被冒泡处理，默认值为 false。
defaultPrevented：表示事件是否已经被阻止默认行为，默认值为 false。
timeStamp：事件创建的时间戳。

示例代码

接下来我们来进行一个示例，实现一个简单的事件驱动程序。

// 定义 Event 类
class Event {
  readonly type: string;
  readonly target: EventTarget | null;
  readonly timeStamp: number;

  constructor(type: string, target: EventTarget | null) {
    this.type = type;
    this.target = target;
    this.timeStamp = Date.now();
  }
}

// 定义 EventTarget 类
class EventEmitter {
  private _eventMap: Map<string, Set<EventListener>>;

  constructor() {
    this._eventMap = new Map();
  }

  addEventListener(type: string, listener: EventListener): void {
    let listeners = this._eventMap.get(type) || new Set();
    listeners.add(listener);
    this._eventMap.set(type, listeners);
  }

  removeEventListener(type: string, listener: EventListener): void {
    let listeners = this._eventMap.get(type);
    if (listeners) {
      listeners.delete(listener);
      this._eventMap.set(type, listeners);
    }
  }

  dispatchEvent(event: Event): boolean {
    let type = event.type;
    let target = event.target;
    event.target = this;
    let listeners = this._eventMap.get(type);
    if (listeners) {
      for (let listener of listeners) {
        listener.call(target, event);
      }
      return true;
    }
    return false;
  }
}

// 定义 EventListener 类型
type EventListener = (event: Event) => void;

// 使用示例
let ee = new EventEmitter();

ee.addEventListener('test', (event: Event) => {
  console.log('listener1', event.type);
});

ee.addEventListener('test', (event: Event) => {
  console.log('listener2', event.type);
});

ee.dispatchEvent(new Event('test', null));

// 输出：
// listener1 test
// listener2 test

在这个示例中，我们定义了一个 Event 类来描述事件，EventEmitter 类来实现事件驱动。用 addEventListener 方法注册事件监听器，用 removeEventListener 方法来移除事件监听器。dispatchEvent 方法用于触发事件，触发事件后会依次调用注册的事件监听器。

最后，我们在 EventEmitter 实例上注册了两个相同类型的事件监听器，当 EventEmitter 实例触发该事件后，两个事件监听器都将被依次执行。

总结

事件驱动是现代 Web 开发中非常重要的一个概念，Deno 中也提供了相应的机制来实现事件驱动。我们可以使用 EventTarget 和 Event 类来实现事件驱动，它们提供了注册、注销和触发事件的方法。在实际开发中，我们可以通过事件驱动机制来提高程序的灵活性和可维护性。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/65a5fe1dadd4f0e0ffe9bde4

Deno 中如何实现事件驱动？

前言

什么是事件驱动？

Deno 中的事件

EventTarget 类

Event 类

示例代码

总结

纠错反馈

`EventTarget` 类

`Event` 类