<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script type="text/javascript">
function EventEmitter() {
this.events = {}
}
// on 监听事件 off移除监听事件 emit
//on off emit
// on("xxx", function(){})
// off("xxx", fn)
// emit("xxx")
//
EventEmitter.prototype.once = function(event, fn) {
if(event) {
this.events[event] = this.events[event]?this.events[event] : []
function wrapFn() {
this.off(event, fn)
fn.apply(this, arguments)
}
wrapFn.fn = fn
this.events[event].push(wrapFn)
}
return this
}
EventEmitter.prototype.on = function(event, fn) {
if(event) {
this.events[event] = this.events[event]?this.events[event] : []
//this.events["xxx"] = []
//
//
this.events[event].push(fn)
}
return this
}
EventEmitter.prototype.off = function(event, fn) {
if(event) {
if(fn) {
var eventHanlders = this.events[event]
for(var i=0;i<eventHanlders.length;) {
if(eventHanlders[i] === fn || eventHanlders[i].fn === fn) {
eventHanlders.splice(i, 1)
} else {
i++
}
}
} else {
this.events[event] = []
}
}
return this
}
EventEmitter.prototype.emit = function(event) {
if(event) {
var args = [].slice.call(arguments, 1)
var eventHanlders = this.events[event]
for(var i=0;i<eventHanlders.length;i++) {
eventHanlders[i].apply(this, args)
}
}
return this;
}
var ee = new EventEmitter()
var fn = function() {
console.log(arguments)
console.log("fn")
}
var fn1 = function() {
console.log("fn1")
}
var aaa = function() {
console.log('aaa')
}
ee.on("xxx", fn).on("aaa", aaa).on('xxx', fn1)
ee.emit("xxx", 'hahaha').emit("aaa")
ee.off("xxx", fn)
console.log('-------')
ee.emit("xxx")
/*ee.off("xxx")
ee.on("aaa", fn)
ee.emit("aaa")
ee.off("aaa")*/
ee.once("aa", function(){console.log('aaaaaaaaa')})
ee.emit('aa')
ee.emit('aa')
</script>
</body>
</html>