pull和push,是在软件中消费数据的两种方式,它们描述了数据生产者(或持有者)与数据消费者之间是如何通讯的。过去我们肯定了解过它们,不过可能会在编程中会忽略它们之间的区别与联系,本篇文章希望帮助大家理解这两者的区别于联系,从而在编程中有意识地分辨与选择它们。
我们可以用一个现实生活中的例子来理解pull与push:
你某天想要阅读新闻,于是打开浏览器,输入新闻网站的地址,敲下回车,于是新闻内容展现在你的眼前。这是一个pull模型;
你也可以,下载一个新闻App,设置消息推送功能,让它时不时向你推送重要的新闻。这是一个push模型。
在pull系统中,数据消费者决定自己何时请求并接收数据;数据持有者只能被动地响应请求。
编程语言的函数机制就是pull系统的例子。函数是数据生产者,调用者是数据消费者。调用者在自己需要的时候,调用函数,从函数中“拉”出一个结果,即let result = func(args);。
JavaScript的Generator function则是pull系统的又一个范例,只不过消费者可以多次pull,依次拿出顺序有关的多个结果:
function* generator(i) {
yield i;
yield i + 10;
}
const gen = generator(10);
const result1 = gen.next().value;
const result2 = gen.next().value;
Async Iterator与普通Iterator类似,是典型的pull模型,只不过pull的结果是异步返回的:
async function* generateSequence(start, end) {
for (let i = start; i <= end; i++) {
await new Promise(resolve => setTimeout(resolve, 1000));
yield i;
}
}
let asyncIterator = generateSequence(1, 5);
let result = await asyncIterator.next(); // {value: 1, done: false}
result = await asyncIterator.next(); // {value: 2, done: false}
数组遍历for (let x of iterable)与for (let x of asyncIterable)也是两种基于pull理念的语法。
在push系统中,数据生产者决定何时向消费者推送数据。数据消费者不知道何时会收到数据更新。
Promise是一个push系统,它的数据生产者是Promise中封装的异步逻辑,数据消费者则是then中的callback函数。生产者决定何时通知消费者。Promise生产者只能给消费者推送一次数据。
RxJS的Observable也是一个push系统,它的生产者能给消费者推送多次数据。
pull与push的特点对比总结如下:
生产者 | 消费者 | |
---|---|---|
pull | 被动。收到请求时返回数据 | 主动。决定何时请求数据 |
push | 主动。决定何时推送数据 | 被动。响应数据的更新 |
两者的典型范例总结如下:
单结果 | 多结果 | |
---|---|---|
pull | Function | 数组遍历、Iterator (Generator) |
push | Promise | Observable |
可以看出,数组等Iterable,与Observable是既对等又相反的关系。
RxJS为push模型提供了统一的抽象组合手段;与之相对应的,IxJS为pull模型提供了统一抽象组合手段。这两个库的api甚至能够一一对应起来。
如果从上面的微观的视角来看Promise,Promise本身确实是一个典型的push模型。但是如果从宏观的视角来看以下这段代码:
// 在视图控制器中的某段代码:
requestServer().then((data) => {
view.update(data);
});
// 等价于:
const data = await requestServer();
view.update(data);
又何尝不是一种pull模型呢?毕竟视图控制器是数据消费者,它主动从服务器(数据生产者)请求数据并使用。
再换一个视角,如果从View的角度看,它被视图控制器通知新数据的到来,View自己只能被动地对数据更新产生反应。这难道不是一种push模型吗?
再换一个视角,上面的这段视图控制器代码是什么时候执行的呢?它总不可能在程序启动的时候运行一次就完成任务了吧?这段代码必定也处在某个事件响应函数中(比如某个按钮的点击事件回调),或者某个组件生命周期钩子中(比如onMounted)。那么它作为一个事件响应函数,是不是必定处于一个push系统中?
再换一个视角,在requestServer中,向服务器发送请求的时候,底层需要通过DNS系统来解析域名,这个查询过程是pull模型,即let ip = await resolveDNS('www.server.com');。
再换一个视角,在操作系统底层,当服务器响应从网络中到来的时候,操作系统唤醒了对应的线程,执行后续的代码。这个过程又是push模型。
可以看到,push与pull,它们作为编码模型的两种选择,是相互竞争的,但是如果你站在不同的抽象层次上,总是能发现另一方的身影。这种“你中有我,我中有你,既相互竞争,又相互依存”的关系,像极了古代中国的哲学思想:阴阳
来自:https://segmentfault.com/a/1190000022931147
在react中是单向数据绑定,而在vue和augular中的特色是双向数据绑定。为什么会选择两种不同的机制呢?我猜测是两种不同的机制有不同的适应场景,查了一些资料后,总结一下。
双向数据绑定是非常重要的特性 —— 将JS模型与HTML视图对应,能减少模板编译时间同时提高用户体验。我们将学习在不使用框架的情况下,使用原生JS实现双向绑定 —— 一种为Object.observe
js判断数据类型的多种方法,主要包括:typeof、instanceof、 constructor、 prototype.toString.call()等,下面就逐一介绍它们的异同。
由于js为弱类型语言拥有动态类型,这意味着相同的变量可用作不同的类型。 typeof 运算符返回一个用来表示表达式的数据类型的字符串,目前typeof返回的字符串有以下这些: undefined、boolean、string、number、object、function、“symbol
在js中我们直接这样写typeof obj===‘object’有什么问题呢?发现Array, Object,null都被认为是一个对象了。如何解决这种情况,能保证判断obj是否为一个对象
js要处理十六进制,十进制,字符之间的转换,发现有很多差不多且书写不正确的方法.一个一个实践才真正清楚如何转换,现在来记录一下它们之间转换的方法。
奇数和偶数的判断是数学运算中经常碰到的问题,这篇文章主要讲解通过JavaScript来实现奇偶数的判断。2种判断方法:求余% 、&1
质数又称素数。指在一个大于1的自然数中,除了1和此整数自身外,没法被其他自然数整除的数。比如100以内共25个,js实现代码如下。
JavaScript自动类型转换真的非常常见,常用的一些便捷的转类型的方式,都是依靠自动转换产生的。比如 转数字 : + x 、 x - 0 , 转字符串 : \\\"\\\" + x 等等。现在总算知道为什么可以这样便捷转换。
XML是标准通用标记语言 (SGML) 的子集,非常适合 Web 传输。XML 提供统一的方法来描述和交换独立于应用程序或供应商的结构化数据。 这篇文章主要介绍Js中实现XML和String相互转化
内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!