1. The observer pattern
The logic into the publisher (in charge of production ⽣ events and notifies all registered observer put up numbers) and the observer (after a publisher is registered on, just received on the handling of the event)
In rxjs in:
-
How to produce ⽣ event, it is the responsibility of the publisher, is ⼯ Observable object as in RxJS in.
-
How to respond to events, it is the responsibility of the observer, in RxJS are determined by the parameters of subscribe.
-
What kind of associate publisher what the observer, that is, when adjusted Using subscribe
2. iterator pattern
Use ⼀ provide through-interface, so Use Application Off Center Weighted completely by this particular data set to achieve shutter mode.
Usually get accustomed functions should contain:
-
· GetCurrent, get the current element is pointed to by the cursor.
-
· MoveToNext, the cursor will move to the next screen elements, after adjustment Using this function, the element getCurrent obtained will be different.
-
· IsDone, have been completed to determine whether all the elements traversed.
Application in rxjs in: after subscribr ongoing push.
3.Observable
var theObserver = { //观察者响应事件
next: item => console.log(item), //表达现在要推送的数据
complete: () => console.log('No More Data'),//推送完结,一般不写
error: () => {console.log('wrong')}//出错
}
var onSubscribe = observer => { //发布者发布事件
var number = 1;
var handle = setInterval(() => {
observer.next(number++);
}, 1000)
return {
unsubscribe: () => { //退订
//clearInterval(handle);
}
};
};
var source$ = new Rx.Observable(onSubscribe);
source$.subscribe(theObserver)
setTimeout(() => {
source$.unsubscribe();
}, 3500);
//Observable产⽣的事件,只有Observer通过subscribe订阅之后才会收到,在unsubscribe之后就不会再收到。
复制代码
1.hot Observable
const producer = new Producer();//独立一个的生产者
const cold$ = new Observable(observer => {
// 然后让observer去接受producer产⽣的数据
});
复制代码
2.Cold Observable
const cold$ = new Observable(observer => {
const producer = new Producer();//对每⼀次subscribe都产⽣⼀个“⽣产者”,
// 然后让observer去接受producer产⽣的数据
});
复制代码
4. The operator according to the function, the operator can be divided into the following categories:
• Create class (creation)
· Transformation class (transformation)
· Filter type (filtering)
· The combined category (combination)
· Multicast class (multicasting)
· Error Handling category (error Handling)
Ancillary ⼯ with categories (utility)
• Condition minute ⽀ class (conditional & boolean)
· Total and mathematics classes (mathmatical & aggregate)
Common operators:
1.create (class functions) create Observable objects
2.map, filter (example function) similar to the map array, filter
Observable objects using bind specific binding (not chained calls),: :( binding operator, chain call):
const operator = map.bind(source$);
const result$ = operator(x => x * 2);
const result$ = source$::map(x => x * 2).filter(x => x % 3 !== 0);
复制代码
Implement operator such as map: Every operator is ⼀ functions, no matter what function to achieve, must consider these points under ⾯ features: · returns to the previous new Observable object.
· Unsubscribe and the subscription process upstream and downstream.
· Handle exceptions.
· Timely release of resources.
Our simple map the operator to achieve points on the screen for instructions.
function map(project) {
return new Observable(observer => {
const sub = this.subscribe({
next: value => {
try {
observer.next(project(value));
} catch (err) {
observer.error(err);
}
},
error: err => observer.error(error),
complete: () => observer.complete(),
});
});
}
复制代码
. . . Continuous update