Why values still emitted

Question

I have the following connectable observable:

//emit value every 1 second
const source = Rx.Observable.interval(1000);
const example = source
  //side effects will be executed once
  .do(() => console.log('Do Something!'))
  //do nothing until connect() is called
  .publish();

/*
  source will not emit values until connect() is called
  output: (after 5s) 
  "Do Something!"
  "Subscriber One: 0"
  "Subscriber Two: 0"
  "Do Something!"
  "Subscriber One: 1"
  "Subscriber Two: 1"
*/
const subscribe = example.subscribe(val => console.log(`Subscriber One: ${val}`));

//call connect after 5 seconds, causing source to begin emitting items
setTimeout(() => {
 example.connect(); 
},5000)

setTimeout(() => {
 subscribe.unsubscribe(); 
},7000)

Why the source observable is still emit an item, even I unsubscribe it?

Answer 1

.connect() is basically a subscription as well, so in order to stop the stream, you have to "disconnect" it, like this e.g.:

let connection;
setTimeout(() => {
 connection = example.connect(); 
},5000)

setTimeout(() => {
 connection.unsubscribe();
 subscribe.unsubscribe(); 
},7000)