-
-
Save menor/bf0911321fb2bc3a641c410bb25c5d22 to your computer and use it in GitHub Desktop.
Building the observable pattern to learn the observable patern // source http://jsbin.com/pewojab
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <script src="https://fb.me/react-with-addons-15.1.0.js"></script> | |
| <script src="https://fb.me/react-dom-15.1.0.js"></script> | |
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta name="description" content="Building the observable pattern"> | |
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width"> | |
| <title>JS Bin</title> | |
| </head> | |
| <body> | |
| <script id="jsbin-javascript"> | |
| 'use strict'; | |
| function Observable() { | |
| this.observers = []; | |
| } | |
| Observable.prototype.add = function (observer) { | |
| this.observers.push(observer); | |
| }; | |
| Observable.prototype.remove = function (observer) { | |
| var index = this.observers.indexOf(observer); | |
| this.observers.splice(index, 1); | |
| }; | |
| Observable.prototype.notify = function (message) { | |
| this.observers.forEach(function (observer) { | |
| observer.update(message); | |
| }); | |
| }; | |
| var observer1 = { | |
| update: function update(message) { | |
| console.log('Observer 1 got:', message); | |
| } | |
| }; | |
| var observer2 = { | |
| update: function update(message) { | |
| console.log('Observer 2 got:', message); | |
| } | |
| }; | |
| var notifier = new Observable(); | |
| notifier.add(observer1); | |
| notifier.add(observer2); | |
| notifier.notify('I am the message'); | |
| </script> | |
| <script id="jsbin-source-javascript" type="text/javascript">function Observable() { | |
| this.observers = [] | |
| } | |
| Observable.prototype.add = function(observer) { | |
| this.observers.push(observer) | |
| } | |
| Observable.prototype.remove = function(observer) { | |
| var index = this.observers.indexOf(observer) | |
| this.observers.splice(index, 1) | |
| } | |
| Observable.prototype.notify = function(message) { | |
| this.observers.forEach( function(observer) { | |
| observer.update(message) | |
| }) | |
| } | |
| const observer1 = { | |
| update: function(message) { | |
| console.log('Observer 1 got:', message) | |
| } | |
| } | |
| const observer2 = { | |
| update: function(message) { | |
| console.log('Observer 2 got:', message) | |
| } | |
| } | |
| var notifier = new Observable() | |
| notifier.add(observer1) | |
| notifier.add(observer2) | |
| notifier.notify('I am the message') | |
| </script></body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| 'use strict'; | |
| function Observable() { | |
| this.observers = []; | |
| } | |
| Observable.prototype.add = function (observer) { | |
| this.observers.push(observer); | |
| }; | |
| Observable.prototype.remove = function (observer) { | |
| var index = this.observers.indexOf(observer); | |
| this.observers.splice(index, 1); | |
| }; | |
| Observable.prototype.notify = function (message) { | |
| this.observers.forEach(function (observer) { | |
| observer.update(message); | |
| }); | |
| }; | |
| var observer1 = { | |
| update: function update(message) { | |
| console.log('Observer 1 got:', message); | |
| } | |
| }; | |
| var observer2 = { | |
| update: function update(message) { | |
| console.log('Observer 2 got:', message); | |
| } | |
| }; | |
| var notifier = new Observable(); | |
| notifier.add(observer1); | |
| notifier.add(observer2); | |
| notifier.notify('I am the message'); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment