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

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

不言
リリース: 2018-10-27 16:43:24
転載
2177 人が閲覧しました

この記事は 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 までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート