JSFiddle - React, Tailwind, and code Playground

by uedatakuya

HTML

<div id="result"></div>

JavaScript

var go = {};

(function () {
    function extend(_super, sub) {
        for (var k in _super) {
            if (_super.hasOwnProperty(k)) {
                sub[k] = _super[k];
            }
        }
    }
    go.extend = extend;
})();

// subscribable
(function () {
    var subscribable = {
        _subscriptions: [],
        subscribe: function (callback, callbackTarget) {
            var _subscribable = this;
            var subscription = {
                callback: callback.bind(callbackTarget),
                dispose: function () {
                    for (var i = 0; i < _subscribable._subscriptions.length; i++) {
                        if (_subscribable._subscriptions[i] === this) {
                            _subscribable._subscriptions.splice(i, 1);
                            break;
                        }
                    }
                }
            };
            this._subscriptions.push(subscription);
            return subscription;
        },
        notifySubscripters: function (valueToNotify) {
            var _subscriptions = this._subscriptions.slice(0);
            for (var i = 0; i < _subscriptions.length; i++) {
                var subscription = _subscriptions[i];
                subscription.callback(valueToNotify);
            }
        }
    };
    go.subscribable = subscribable;
})();

// Test
(function () {
    var subscribable = {};
    go.extend(go.subscribable, subscribable);
    var subscription = subscribable.subscribe(function (value) {
        document.querySelector('#result').innerText = value;
    });
    subscribable.notifySubscripters('hoge');
    subscription.dispose();
    subscribable.notifySubscripters('piyo');
})();