ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript イベントの送受信メカニズムを理解する (コード例)

JavaScript イベントの送受信メカニズムを理解する (コード例)

不言
不言転載
2018-10-27 16:43:062186ブラウズ

この記事は JavaScript イベントの受信および送信メカニズムの理解に関するものです (コード例)。必要な方は参考にしていただければ幸いです。

実際、イベントの送受信メカニズムは非常に単純ですが、私が考えなかっただけです。

これはノード モジュールでさらに使用される予定です。
次のようなものです。

var events=require('events');
var eventEmitter=new events.EventEmitter();
eventEmitter.on('say',function(name){
    console.log('Hello',name);
})
eventEmitter.emit('say','Jony yu');

vue では、親子コンポーネントの送信にもイベントの送受信を使用し、エミットなどを行って

それでは、見てみましょう

function myEvent() {

    this.on = function() {
        if (!this.handles) {
            this.handles = {};
        }
        if (!this.handles[eventName]) {
            this.handles[eventName] = [];
        }
        this.handles[eventName].push(callBack);
    }

    this.emit = function() {
        if (this.handles[eventName]) {
            for (var i = 0; o < this.handles[eventName].length; i++) {
                this.handles[eventName][i](obj);
            }
        }
    }
    return this;
}

Test it

var event1=new Events();
var event2=new Events();
event1.on('say',function(){
    console.log('Jony event1');
});
event2.on('say',function(){
    console.log('Jony event2');
})
event1.emit('say');
event2.emit('say');
//event1、event2之间的事件监听互相不影响
//输出结果为'Jony event1' 'Jony event2'

これはイベントを送受信するためのメカニズムです。

以上がJavaScript イベントの送受信メカニズムを理解する (コード例)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はsegmentfault.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。