angular中的observable问题

import { Observable } from 'rxjs';

 // observable 使用之前先引入
  getObservable(){
    return new Observable((observer)=>{
      setTimeout(()=>{
        var data = 'observer数据'
        observer.next(data)                //相当于promise的resolve
      },2000)
    })
  }

import { StorageService } from 'src/app/services/storage.service';
 
constructor(public storage:StorageService) { }

let oberverData = this.storage.getObservable()
 
let d = oberverData.subscribe((res)=>{        //相当于promise的then
      console.log(res)
})

setTimeout(()=>{
      d.unsubscribe()            //一秒钟之后取消订阅，接收不到消息
},1000)

let p = new Promise(resolve=>{
      setInterval(()=>{
        resolve('promise interval值')
      },2000)
})
p.then(res=>console.log(res))     //只输出一次
 
// observable
let o = new Observable(observer=>{
    setInterval(()=>{
       observer.next('observable interval值')
    },2000)
})
o.subscribe(res=>console.log(res))    //每隔2秒输出一次

let o1 = this.storage.getObservable1()
o1.pipe(
   filter((data:any)=> {
      return data%2 == 0
   }),
   map(value => {
      return value*value
   })
).subscribe(res=>console.log(res))

 items$: Observable<Observable<Product>[]> = this.componentData$.pipe(
    map((data) => data.productCodes.trim().split(' ')),
    map((codes) =>
      codes.map((code) => this.productService.get(code, this.PRODUCT_SCOPE))
    )
  );

  private componentData$: Observable<model> = this.componentData.data$.pipe(
    filter(Boolean)
  );

  private componentData$: Observable<model> = this.componentData.data$.pipe(
    filter(Boolean)
  );

const mockComponentData: CmsProductCarouselComponent = {
  uid: '001',
  typeCode: 'ProductCarouselComponent',
  modifiedTime: new Date('2017-12-21T18:15:15+0000'),
  popup: 'false',
  productCodes: productCodeArray.join(' '),
  scroll: 'ALLVISIBLE',
  title: 'Mock Title',
  name: 'Mock Product Carousel',
  container: 'false',
};
const MockCmsProductCarouselComponent = <CmsComponentData<any>>{
  data$: of(mockComponentData),
};