An observable represents data or events that arrive over time. You subscribe to it to receive its ordered values, whether they come from user input, a file, a web service, a database, notifications, a collection, or a string. section 8.4
Observables make different kinds of data work through the same functional pipeline:
- Create a stream from values, ranges, promises, generators, or events. section 8.4
- Transform values with operations such as map and filter, then chain those operations. section 1.3 section 8.4
- Subscribe to receive each value, handle errors, and respond when the stream completes. section 8.4
Validate an input stream
Instead of putting all SSN handling inside an event callback, create an observable from the input event and process each value through small functions: Rx.Observable.fromEvent(document.querySelector('#student-ssn'), 'change') .map(event => event.target.value) .map(cleanInput) .map(checkLengthSsn) .subscribe(ssn => ssn.isRight ? console.log('Valid') : console.log('Invalid')); The same pattern handles a stream of user input as a sequence that can be transformed and consumed. section 1.3 section 8.4
Rx.Observable.fromEvent(
document.querySelector('#student-ssn'), 'change') #1
.map(x => x.target.value) #2
.map(cleanInput) #3
.map(checkLengthSsn) #3
.subscribe( #4
ssn => ssn.isRight ? console.log('Valid') : console.log('Invalid'));
Follow the complete event-stream pipeline from DOM events through extraction, cleaning, validation, and subscription. section 8.4
