Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="RxJS Countdown">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
<script src="https://unpkg.com/@reactivex/rxjs@5.0.3/dist/global/Rx.js"></script>
?
</body>
</html>
 
body {
  font-size: 8em;
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Fira Sans","Droid Sans","Helvetica Neue",sans-serif;
  text-align: center;
  font-weight: 900;
  padding: 1em;
  color: #f31fc9;
  background-color: #011627;
}
 
/**
Countdown Exercise
Lesson:
    interval(1000) creates a stream that emits incremental numbers every 1000ms. 
    - 1000ms after the stream has started, it emits 0
    - Then, after 1000ms it emits 1
    - And so on
Exercise: 
    - Create a countdown from 10 to 0
    - The stream starts immediately with 10 (you shouldn't see the '?' default document value)
    - The stream completes immediately after 0
     
Hints: 
    - Begin with Rx.Observable.interval(1000)
    - Complete with some operators from http://reactive.how/categories
    
Test: 
     - Watch the result on the "Output" panel, as you type
     - Click "Run with JS" above this panel to reset the execution
*/
const countdown =
      Rx.Observable   
        .interval(1000)
        //map(n=>n+1)
    
countdown.subscribe(n => document.body.innerHTML = n);
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
cedricsspro
0viewers