-
-
Save fatihacet/1290216 to your computer and use it in GitHub Desktop.
var pubsub = {}; | |
(function(q) { | |
var topics = {}, subUid = -1; | |
q.subscribe = function(topic, func) { | |
if (!topics[topic]) { | |
topics[topic] = []; | |
} | |
var token = (++subUid).toString(); | |
topics[topic].push({ | |
token: token, | |
func: func | |
}); | |
return token; | |
}; | |
q.publish = function(topic, args) { | |
if (!topics[topic]) { | |
return false; | |
} | |
setTimeout(function() { | |
var subscribers = topics[topic], | |
len = subscribers ? subscribers.length : 0; | |
while (len--) { | |
subscribers[len].func(topic, args); | |
} | |
}, 0); | |
return true; | |
}; | |
q.unsubscribe = function(token) { | |
for (var m in topics) { | |
if (topics[m]) { | |
for (var i = 0, j = topics[m].length; i < j; i++) { | |
if (topics[m][i].token === token) { | |
topics[m].splice(i, 1); | |
return token; | |
} | |
} | |
} | |
} | |
return false; | |
}; | |
}(pubsub)); |
some questions here!
If my thought was wrong, please tell me.
I am new to javascript!
https://gist.github.com/fatihacet/1290216#file-pubsub-simple-js-L17-L27
- I think it could be more simpler.
var subscribers = topics[topic];
if (!subscribers) {
return false;
}
setTimeout(function(){
for(var i=0, len = subscribers.length; i<len; i++) {
subscribers[len].func(subscribers, args);
}
}, 0);
https://gist.github.com/fatihacet/1290216#file-pubsub-simple-js-L34
2. and this conditional statement looks like unnecessary
https://gist.github.com/fatihacet/1290216#file-pubsub-simple-js-L22
3. also I can't understand why he used conditional statement here.
Is it unnecessary that we checked the conditional statement for undefined from the top?
ps. thank you for nice implementation. It was really helpful.
While above is good, and it's crazily 7 years old. I try below method. Instead of using an array, I use an object for each subscriptions as well. Simpler and smaller Also note the unsubscribe closure return in publish, kinda helps.
PubSub.js
class PubSub {
constructor () {
this.subIds = 0;
this.subscriptions = {}
}
subscribe (topic, fn) {
if(!this.subscriptions[topic]) this.subscriptions[topic] = {}
const token = ++this.subIds;
// Validate topic name and function constructor
this.subscriptions[topic][token] = fn;
return () => this.unsubscribe(topic, token)
}
publish (topic, ...args) {
const subs = this.subscriptions[topic];
if(!subs) return false
Object.values(subs).forEach(sub => sub(...args))
}
unsubscribe (topic, token) {
if(!token) delete this.subscriptions[topic]; // Delete all subscriptions for the topic
this.subscriptions[topic] && (delete this.subscriptions[topic][token]); // Delete specific subscription
}
}
export default new PubSub();
Example
const unsub1 = PubSub.subscribe('spacex', data => console.log('Falcon was launched', data));
const unsub2 = PubSub.subscribe('spacex', data => console.log('Falcon Heavy was launched', data));
PubSub.publish('spacex', 'some data slash params')
// Unsubscribe single subscription
unsub1(); // Unsubscribes Falcon
unsub2(); // Unsubscribes Falcon Heavy
// Unsubscribe ALL subscriptions for a topic
PubSub.unsubscribe('spacex')
This isn't publish subscribe pattern, this is the simplest observer pattern.
How can I use this as a subscriber
@scazzy thank you it's precisely what i needed
@mocheng (nearly a year after your question...) The
for...in
loop allows an individual subscription to be cancelled (via thetoken
returned upon subscribing). Removing the loop would destroy the event entirely, rather than a single subscription. A way around that might be to specify some ID token in the event likeclick.token
. I'm not sure what arguments exist for which is better/worse.Additionally, in your example,
if (topics[m])
would fail becausem
is not defined without the loop. I'm guessing you meant something liketopics[event]
whereevent
would be passed through theunsubscribe()
params. For example:With all of that said, you've probably already come to this conclusion after a year or don't care and have totally forgotten about this code. Either way, it was a good exercise for me ^_^