在 window-ref.ts 的實現里，定義了一個每隔 300 毫秒，通過 fromEvent 發射一個 resize event 的Observable：

/*** Returns an observable for the window resize event and emits an event* every 300ms in case of resizing. An event is simulated initially.** If there's no window object available (i.e. in SSR), a null value is emitted.*/get resize$(): Observable<any> {if (!this.nativeWindow) {return of(null);} else {return fromEvent(this.nativeWindow, 'resize').pipe(debounceTime(300),startWith({ target: this.nativeWindow }),distinctUntilChanged());}}

加上 distingctUntilChanged 操作符后，能過濾掉完全一致的 resize event. 下面的例子，展示了如何使用 distingctUntilChanged，將數字序列里重復的數字過濾掉。distingctUntilChanged 默認會將當前元素和前一元素做比較。

import { of } from 'rxjs'; import { distinctUntilChanged } from 'rxjs/operators';of(1, 1, 2, 2, 2, 1, 1, 2, 3, 3, 4).pipe(distinctUntilChanged(),).subscribe(x => console.log(x)); // 1, 2, 1, 2, 3, 4

下列例子展示了如何將自定義的比較邏輯，通過箭頭函數作為參數，傳入 distinctUntilChanged 里。

import { of } from 'rxjs'; import { distinctUntilChanged } from 'rxjs/operators';interface Person {age: number,name: string }of<Person>({ age: 4, name: 'Foo'},{ age: 7, name: 'Bar'},{ age: 5, name: 'Foo'},{ age: 6, name: 'Foo'},).pipe(distinctUntilChanged((p: Person, q: Person) => p.name === q.name),).subscribe(x => console.log(x));// displays: // { age: 4, name: 'Foo' } // { age: 7, name: 'Bar' } // { age: 5, name: 'Foo' }

總結

以上是生活随笔為你收集整理的Rxjs debounce 操作符在 SAP Spartacus 函数节流中的一个实际使用例子的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。