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实例对象

猜你喜欢

转载自blog.csdn.net/qq_41231694/article/details/126514334