微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

js事件分发就是实现类似于vue eventBus的功能

function Eventdispatcher() {}
 
	Object.assign( Eventdispatcher.prototype, {
 
		addEventListener: function ( type, listener ) {
 
			if ( this._listeners === undefined ) this._listeners = {};
 
			var listeners = this._listeners;
 
			if ( listeners[ type ] === undefined ) {
 
				listeners[ type ] = [];
			}
 
			if ( listeners[ type ].indexOf( listener ) === - 1 ) {
 
				listeners[ type ].push( listener );
 
			}
 
		},
 
		hasEventListener: function ( type, listener ) {
 
			if ( this._listeners === undefined ) return false;
 
			var listeners = this._listeners;
 
			return listeners[ type ] !== undefined && listeners[ type ].indexOf( listener ) !== - 1;
 
		},
 
		removeEventListener: function ( type, listener ) {
 
			if ( this._listeners === undefined ) return;
 
			var listeners = this._listeners;
			var listenerArray = listeners[ type ];
 
			if ( listenerArray !== undefined ) {
 
				var index = listenerArray.indexOf( listener );
 
				if ( index !== - 1 ) {
 
					listenerArray.splice( index, 1 );
 
				}
 
			}
 
		},
 
		dispatchEvent: function ( event ) {
 
			if ( this._listeners === undefined ) return;
 
			var listeners = this._listeners;
			var listenerArray = listeners[ event.type ];
 
			if ( listenerArray !== undefined ) {
 
				event.target = this;
 
				var array = listenerArray.slice( 0 );
 
				for ( var i = 0, l = array.length; i < l; i ++ ) {
 
					array[ i ].call( this, event );
				}
			}
		}
	} );
 
	var pac=new Eventdispatcher();
	var mm=null;
	pac.addEventListener("xuhaitao",function(){
		mm=this;
		console.log(this,"wo  zi ji");
    })
 
	var nn=null;
	pac.addEventListener("xuhaitao",function(){
		nn=this;
		console.log(this,"wo di di");
	})
    pac.dispatchEvent({type:"xuhaitao"})
	console.log(mm===nn);

两个this都指向pac实例对象

原文地址:https://www.jb51.cc/wenti/3280243.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐