찾다
웹 프론트엔드JS 튜토리얼이벤트 모듈에 대해 Node.js 학습 및 채팅

이 글은 Node.js의 이벤트 모듈을 이해하고 이벤트의 게시 및 구독 모델을 소개하는 데 도움이 될 것입니다.

이벤트 모듈에 대해 Node.js 학습 및 채팅

이벤트 모듈

참조 공식 웹사이트: 이벤트 이벤트 트리거 | Node.js

http://nodejs.cn/api/events.html

이벤트 모듈 Node의 가장 중요한 모듈입니다. EventEmitter 속성을 ​​제공합니다. EventEmitter의 핵심은 이벤트 방출과 이벤트 리스너입니다. Events 模块是Node最重要的模块,它提供了一个属性 EventEmitterEventEmitter 的核心是事件发射与事件监听器。

Node中大部分的模块,都继承自 Events 模块。

  • Events 模块是Node对 发布订阅模式publish/subscribe)的实现。一个对象通过这个模块,向另一个对象传递消息。
  • 该模块通过 EventEmitter 属性,提供了一个构造函数。该构造函数的实例具有 on 方法,可以用来监听指定事件,并触发回调函数。
  • 任意对象都可以发布指定事件,被 EventEmitter 实例的on方法监听到。

发布订阅模式

关于 发布订阅模式 ,可以参考我之前的博客文章。

关于 Events 中的发布订阅模式,我们要先清楚它的几个常用方法。

  • 订阅方法on 方法用来订阅事件,订阅是将方法对应成一种一对多的关系。
  • 发布方法emit 用来执行订阅的事件。
  • 取消订阅off 方法可以移除对应的事件监听。
  • 订阅一次once 绑定事件当执行后自动删除订阅的事件。

on 和 emit

on 方法的第一个参数用来设定类名,第二个参数也是一个函数,里面可以接收发布时传入的参数。

emit 方法第一个参数是类名,之后的参数都是传入 on 方法函数中的参数。

onemit 具体应用可以参考下面这个简单的Demo。

const EventEmitter = require('events');
// 自定义一个 构造函数
function Cat() {}
// 原型继承 需要通过实例来调用继承方法
Object.setPrototypeOf(Cat.prototype, EventEmitter.prototype);
let cat = new Cat();
const sleep = (a, b) => {
    console.log(a, '睡');
};
const eat = (a, b) => {
    console.log(b, '吃');
};
cat.on('猫咪', sleep)
cat.on('猫咪', eat)
setTimeout(() => {
  	// 小胡子 吃
  	// 小胖仙 睡
    cat.emit('猫咪', '小胖仙', '小胡子')
}, 1000);

现在我们可以实现一套 onemit 方法。

function EventEmitter() {
    this._event = {}
}
// on 方法
EventEmitter.prototype.on = function (eventName, callBack) {
    if (!this._event) {
        this._event = {}
    }
    if (this._event[eventName]) {
        this._event[eventName].push(callBack) // 相当于 {eventName:[fn1,fn2]}
    } else {
        this._event[eventName] = [callBack]; // 相当于 {eventName:[fn1]}
    }

}
// emit 方法
EventEmitter.prototype.emit = function (eventName, ...args) {
    this._event[eventName].forEach(fn => {
        fn(...args)
    });
}

off

off 方法的第一个参数用来设定类名,第二个参数传入需要被移除的函数回调。

// ...
setTimeout(() => {
  	// 小胡子 吃
  	// 小胖仙 睡
    cat.emit('猫咪', '小胖仙', '小胡子')
  	cat.off('猫咪', sleep);
  	// 小胡子 吃
    cat.emit('猫咪', '小胖仙', '小胡子')
}, 1000);

这样我们可以大概判断出来,移除掉和我们传入函数相同的函数,我们很快想到 filter 方法。

// off 方法
EventEmitter.prototype.off = function (eventName, callBack) {
    if (this._event && this._event[eventName]) {
        this._event[eventName] = this._event[eventName].filter(
          fn => fn !== callBack && fn.c !== callBack // fn.c参考下面的once方法实现
        )
    }
}

once

once 方法的第一个参数用来设定类名,第二个参数传入只需要执行一次的函数回调。

// ...
const demolition =() => {
    console.log('拆家');
}
cat.once('猫咪', demolition)
setTimeout(() => {
  	// ...... 拆家
    cat.emit('猫咪', '小胖仙', '小胡子')
}, 1000);

这样我们可以根据之前实现的 onoff 来实现此方法。

// once 方法
EventEmitter.prototype.once = function (eventName, callBack) {
    const one = () => {
        callBack();
        this.off(eventName, one);
    }
    this.on(eventName, one);
}

看起来这个方法好像没有什么问题,执行起来也全都是正确的。

但是在一种特殊情况下的时候,还是出现了错误。

那种情况就是如果我们在执行 once 方法之前,就已经通过 off 方法将其移除了。

我们实现的方法就不能实现这个需求了,所以我们还需要对 once 方法进行一些修改 off 方法已经处理过了)

添加一个自定义属性,用来对函数进行 “缓存” 。

EventEmitter.prototype.once = function (eventName, callBack) {
    const one = () => {
        // ...
    }
    one.c = callBack; // 自定义一个属性
    // ...
}

这样我们就实现了 once

Node에 있는 대부분의 모듈은 Events 모듈에서 상속됩니다.

  • 이벤트 모듈은 Node에서
    게시-구독 모델(게시/구독)을 구현한 것입니다. 한 개체는 이 모듈을 통해 다른 개체에 메시지를 전달합니다.
  • 이 모듈은 EventEmitter 속성을 ​​통해 생성자를 제공합니다. 이 생성자의 인스턴스에는 지정된 이벤트를 수신하고 콜백 함수를 트리거하는 데 사용할 수 있는 on 메서드가 있습니다.
  • 모든 객체는 EventEmitter 인스턴스의 on 메서드로 모니터링되는 지정된 이벤트를 게시할 수 있습니다.

🎜모델 게시 및 구독🎜

🎜🎜모델 게시 및 구독🎜, 이전 블로그 기사를 참조할 수 있습니다. 🎜🎜🎜 이벤트의 게시 및 구독 모델과 ​​관련하여 먼저 몇 가지 일반적인 방법을 이해해야 합니다. 🎜
  • 🎜구독 방법🎜: on 방법은 이벤트를 구독하는 데 사용됩니다. 구독은 방법을 일대다 관계로 매핑합니다.
  • 🎜게시 방법🎜: emit은 구독된 이벤트를 실행하는 데 사용됩니다.
  • 🎜Unsubscribe🎜: off 메소드는 해당 이벤트 리스너를 제거할 수 있습니다.
  • 🎜Subscribe Once🎜: once 바인딩된 이벤트는 실행 후 구독된 이벤트를 자동으로 삭제합니다.

🎜on andemit🎜

🎜on 메소드의 첫 번째 매개변수는 클래스를 설정하는 데 사용됩니다. name 의 두 번째 매개변수도 함수이며 게시 시 전달된 매개변수를 받을 수 있습니다. 🎜🎜 emit 메소드의 첫 번째 매개변수는 클래스 이름이고, 후속 매개변수는 on 메소드 함수에 전달되는 매개변수입니다. 🎜🎜onemit 특정 애플리케이션에 대해서는 아래의 간단한 데모를 참조하세요. 🎜rrreee🎜이제 onemit 메서드 세트를 구현할 수 있습니다. 🎜rrreee

🎜off🎜

🎜off 메소드의 첫 번째 매개변수는 클래스 이름을 설정하는 데 사용되고 두 번째 매개변수는 전달됩니다. 필요에 따라 제거된 함수 콜백입니다. 🎜rrreee🎜 이렇게 하면 우리가 전달한 함수와 동일한 함수를 대략적으로 판단하고 제거할 수 있습니다. 우리는
filter🎜 방법. 🎜rrreee

🎜once🎜

🎜once 메소드의 첫 번째 매개변수는 클래스 이름을 설정하는 데 사용되고 두 번째 매개변수는 전달됩니다. 한 번만 실행해야 하는 함수 콜백입니다. 🎜rrreee🎜이렇게 하면 이전에 구현된 onoff를 기반으로 이 메서드를 구현할 수 있습니다. 🎜rrreee🎜이 방법에는 문제가 없는 것 같고 모두 올바르게 실행된 것 같습니다. 🎜🎜그러나 특수한 상황에서는 여전히 오류가 발생했습니다. 🎜🎜그 상황은 once 메소드를 실행하기 전에 off 메소드를 통해 제거한 경우입니다. 🎜🎜우리가 구현한 방법은 이 요구 사항을 충족할 수 없으므로 여전히 once 방법을 일부 수정해야 합니다(off 방법은 이미 처리되었습니다). 🎜🎜함수를 "캐시"하려면 사용자 정의 속성을 추가하세요. 🎜rrreee🎜이런 식으로 once 메서드를 구현했습니다. 🎜🎜노드 관련 지식을 더 보려면 🎜nodejs 튜토리얼🎜을 방문하세요! ! 🎜🎜

위 내용은 이벤트 모듈에 대해 Node.js 학습 및 채팅의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명
이 기사는 掘金社区에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제
JavaScript, C 및 브라우저의 관계JavaScript, C 및 브라우저의 관계May 01, 2025 am 12:06 AM

서론 나는 당신이 이상하다는 것을 알고 있습니다. JavaScript, C 및 Browser는 정확히 무엇을해야합니까? 그들은 관련이없는 것처럼 보이지만 실제로는 현대 웹 개발에서 매우 중요한 역할을합니다. 오늘 우리는이 세 가지 사이의 밀접한 관계에 대해 논의 할 것입니다. 이 기사를 통해 브라우저에서 JavaScript가 어떻게 실행되는지, 브라우저 엔진의 C 역할 및 웹 페이지의 렌더링 및 상호 작용을 유도하기 위해 함께 작동하는 방법을 알게됩니다. 우리는 모두 JavaScript와 브라우저의 관계를 알고 있습니다. JavaScript는 프론트 엔드 개발의 핵심 언어입니다. 브라우저에서 직접 실행되므로 웹 페이지를 생생하고 흥미롭게 만듭니다. 왜 Javascr

Node.js는 TypeScript가있는 스트림입니다Node.js는 TypeScript가있는 스트림입니다Apr 30, 2025 am 08:22 AM

Node.js는 크림 덕분에 효율적인 I/O에서 탁월합니다. 스트림은 메모리 오버로드를 피하고 큰 파일, 네트워크 작업 및 실시간 애플리케이션을위한 메모리 과부하를 피하기 위해 데이터를 점차적으로 처리합니다. 스트림을 TypeScript의 유형 안전과 결합하면 Powe가 생성됩니다

Python vs. JavaScript : 성능 및 효율성 고려 사항Python vs. JavaScript : 성능 및 효율성 고려 사항Apr 30, 2025 am 12:08 AM

파이썬과 자바 스크립트 간의 성능과 효율성의 차이는 주로 다음과 같이 반영됩니다. 1) 해석 된 언어로서, 파이썬은 느리게 실행되지만 개발 효율이 높고 빠른 프로토 타입 개발에 적합합니다. 2) JavaScript는 브라우저의 단일 스레드로 제한되지만 멀티 스레딩 및 비동기 I/O는 Node.js의 성능을 향상시키는 데 사용될 수 있으며 실제 프로젝트에서는 이점이 있습니다.

JavaScript의 기원 : 구현 언어 탐색JavaScript의 기원 : 구현 언어 탐색Apr 29, 2025 am 12:51 AM

JavaScript는 1995 년에 시작하여 Brandon Ike에 의해 만들어졌으며 언어를 C로 실현했습니다. 1.C Language는 JavaScript의 고성능 및 시스템 수준 프로그래밍 기능을 제공합니다. 2. JavaScript의 메모리 관리 및 성능 최적화는 C 언어에 의존합니다. 3. C 언어의 크로스 플랫폼 기능은 자바 스크립트가 다른 운영 체제에서 효율적으로 실행하는 데 도움이됩니다.

무대 뒤에서 : 어떤 언어의 힘이 자바 스크립트입니까?무대 뒤에서 : 어떤 언어의 힘이 자바 스크립트입니까?Apr 28, 2025 am 12:01 AM

JavaScript는 브라우저 및 Node.js 환경에서 실행되며 JavaScript 엔진을 사용하여 코드를 구문 분석하고 실행합니다. 1) 구문 분석 단계에서 초록 구문 트리 (AST)를 생성합니다. 2) 컴파일 단계에서 AST를 바이트 코드 또는 기계 코드로 변환합니다. 3) 실행 단계에서 컴파일 된 코드를 실행하십시오.

파이썬과 자바 스크립트의 미래 : 트렌드와 예측파이썬과 자바 스크립트의 미래 : 트렌드와 예측Apr 27, 2025 am 12:21 AM

Python 및 JavaScript의 미래 추세에는 다음이 포함됩니다. 1. Python은 과학 컴퓨팅 분야에서의 위치를 ​​통합하고 AI, 2. JavaScript는 웹 기술의 개발을 촉진하고, 3. 교차 플랫폼 개발이 핫한 주제가되고 4. 성능 최적화가 중점을 둘 것입니다. 둘 다 해당 분야에서 응용 프로그램 시나리오를 계속 확장하고 성능이 더 많은 혁신을 일으킬 것입니다.

Python vs. JavaScript : 개발 환경 및 도구Python vs. JavaScript : 개발 환경 및 도구Apr 26, 2025 am 12:09 AM

개발 환경에서 Python과 JavaScript의 선택이 모두 중요합니다. 1) Python의 개발 환경에는 Pycharm, Jupyternotebook 및 Anaconda가 포함되어 있으며 데이터 과학 및 빠른 프로토 타이핑에 적합합니다. 2) JavaScript의 개발 환경에는 Node.js, VScode 및 Webpack이 포함되어 있으며 프론트 엔드 및 백엔드 개발에 적합합니다. 프로젝트 요구에 따라 올바른 도구를 선택하면 개발 효율성과 프로젝트 성공률이 향상 될 수 있습니다.

JavaScript가 C로 작성 되었습니까? 증거를 검토합니다JavaScript가 C로 작성 되었습니까? 증거를 검토합니다Apr 25, 2025 am 12:15 AM

예, JavaScript의 엔진 코어는 C로 작성되었습니다. 1) C 언어는 효율적인 성능과 기본 제어를 제공하며, 이는 JavaScript 엔진 개발에 적합합니다. 2) V8 엔진을 예를 들어, 핵심은 C로 작성되며 C의 효율성 및 객체 지향적 특성을 결합하여 C로 작성됩니다.

See all articles

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

Video Face Swap

Video Face Swap

완전히 무료인 AI 얼굴 교환 도구를 사용하여 모든 비디오의 얼굴을 쉽게 바꾸세요!

뜨거운 도구

MinGW - Windows용 미니멀리스트 GNU

MinGW - Windows용 미니멀리스트 GNU

이 프로젝트는 osdn.net/projects/mingw로 마이그레이션되는 중입니다. 계속해서 그곳에서 우리를 팔로우할 수 있습니다. MinGW: GCC(GNU Compiler Collection)의 기본 Windows 포트로, 기본 Windows 애플리케이션을 구축하기 위한 무료 배포 가능 가져오기 라이브러리 및 헤더 파일로 C99 기능을 지원하는 MSVC 런타임에 대한 확장이 포함되어 있습니다. 모든 MinGW 소프트웨어는 64비트 Windows 플랫폼에서 실행될 수 있습니다.

Eclipse용 SAP NetWeaver 서버 어댑터

Eclipse용 SAP NetWeaver 서버 어댑터

Eclipse를 SAP NetWeaver 애플리케이션 서버와 통합합니다.

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

Dreamweaver Mac版

Dreamweaver Mac版

시각적 웹 개발 도구