- Rxjs的基础就是oberver观察这模式,但是单个数据的流确是Iterator模式(这个包装转化也可以转化为observer模式),也就是说rxjs的基础的Observable其实是observer模式和Iterator模式的混合,话回正题,回归下这两种模式
- Observer模式(基于js的)
<script type="application/javascript">
function Producer(){
this.listeners = [];
}
Producer.prototype.add = function(listener){
this.listeners.push(listener);
};
Producer.prototype.remove = function(listener){
var index = this.listeners.indexOf(listener);
this.listeners.splice(index,1);
};
Producer.prototype.notify = function(message){
this.listeners.forEach(function(listener){
listener.update(message);
});
};
var listener1 = {
update:function(message){
console.log("listener1 received:",message);
}
};
var listener2 = {
update:function(message){
console.log("listener2 received:",message);
}
};
var notifier = new Producer();
notifier.add(listener1);
notifier.add(listener2);
notifier.notify('hello world!');
</script>
结果如下:
》listener1 received: hello world!
》listener2 received: hello world!
以上例子很简单,但是比较好的阐述了观察者模式如何让事件和监听对象的解耦,并让它们产生反应。
- Iterator模式
<script type="application/javascript">
function iterateOnMultiples(arr, divisor) {
this.cursor = 0;
this.array = arr;
this.divisor = divisor || 1;
}
iterateOnMultiples.prototype.next = function(){
while(this.cursor<this.array.length){
var value = this.array[this.cursor++];
if(value%this.divisor===0){
return value;
}
}
};
iterateOnMultiples.prototype.hasNext = function(){
var cur = this.cursor;
while(cur<this.array.length){
if(this.array[cur++]%this.divisor===0){
return true;
}
}
return false;
};
var consumer = new iterateOnMultiples([1,2,3,4,5,6,7,8,9,10],3);
console.log(consumer.next(),consumer.hasNext());
console.log(consumer.next(),consumer.hasNext());
console.log(consumer.next(),consumer.hasNext());
</script>
结果:
》3 true
》6 true
》9 false
迭代器模型用来封装串型逻辑结构(任何类型数据结构)是很有用的。