简易promise的实现(一)
最近在思考promise的实现原理
于是准备自己写一个简单的demo
一开始想到的问题有两个
1.链式调用
2.异步顺序执行
-------------------------------------------------
我们先声明一个异步操作的函数 来模拟异步请求
function http(url){
return new MyPromise(function(resolve,reject){
setTimeout(function(){
resolve(url);
},1000)
})
}
下面就开始写一个简单的promise
有 then,resolve,reject方法
1.then里面会有一个回调方法,我们用callback存起来
2.then回调之后可能会 return,我们用 res保存 callback的返回值,丢到下一个then的resolve中,作为参数。
3.注意,有时候我们没写then方法,所以没有回调。这个时候就要判断了,不需要执行回调
function MyPromise(fn) {
var res = null,
callback = null;
function resolve(val) {
if(typeof(callback) === 'function'){
res = callback(val);
}
}
function reject(val){
if(typeof(callback) === 'function'){
res = callback(val);
}
}
this.then = function (cb) {
callback = cb;
return new MyPromise(function(resolve,reject){
setTimeout(() => {
resolve(res);
}, 3000);
})
};
fn(resolve,reject);
}
现在我们调用一下
http('www.123.com').then(function(res){
console.log(res)
return 123132;
}).then(function(res){
console.log(res)
})
输出

和我们预期的一样,第一个 then里面的参数也传到第二个then方法中了
但是这样也有很多问题
1.第一个异步时间是1000ms,then方法里面的异步时间是 3000ms
加入第二个请求比第一个快,那个 前面的return 后面接收不到。结果输出undefiend
2.如果第一个 return一个异步请求,那么 第二个then收到的是一个promise对象,而不是 promise resolve之后的值
请看下一章
简易promise的实现(一)的更多相关文章
- 简易promise
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8" ...
- 实现简易Promise
概述 异步编程离不开promise, async, 事件响应这些东西,为了更好地异步编程,我打算探究一下promise的实现原理,方法是自己实现一个简易的promise. 根据promise mdn上 ...
- 简易promise的实现(二)
code 上一章中我们遇到了两个问题 1.异步调用顺序的问题 2.then返回一个promise的问题 思考 如果控制异步回调的顺序? 因为异步操的时间作我们无法控制,但是我们只需要按顺序执行回调函数 ...
- ES6之promise原理
我在这里介绍了promise的原理: https://juejin.im/post/5cc54877f265da03b8585902 我在这里 仅仅张贴 我自己实现的简易promise——DiProm ...
- 用JavaScript完成页面自动操作
在之前的一篇<JavaScript实现按键精灵>中曾记录了几个事件对象,本文将会对它们进行一次实战,要完成的动作包括滚动.点击和翻页. 一.滚动 滚动是通过修改容器元素的scrollTop ...
- Promise实现简易AMD加载器
在最新的Chrome和FF中已经 实现了Promise.有了Promise我们用数行代码即可实现一个简易AMD模式的加载器 var registry = { promises: { }, resolv ...
- 10行代码实现简易版的Promise
实现之前,我们先看看Promise的调用 const src = 'https://img-ph-mirror.nosdn.127.net/sLP6rNBbQhy0OXFNYD9XIA==/79910 ...
- 手写简易版Promise
实现一个简易版 Promise 在完成符合 Promise/A+ 规范的代码之前,我们可以先来实现一个简易版 Promise,因为在面试中,如果你能实现出一个简易版的 Promise 基本可以过关了. ...
- 手写Promise简易版
话不多说,直接上代码 通过ES5的模块化封装,向外暴露一个属性 (function(window){ const PENDING = 'pending'; const RESOLVED = 'fulf ...
随机推荐
- numba学习教程
一.对于python的基础介绍 Python是一种高效的动态编程语言,广泛用于科学,工程和数据分析应用程序..影响python普及的因素有很多,包括干净,富有表现力的语法和标准数据结构,全面的“电池包 ...
- 51nod 1630(定积分 + 期望)
51nod1630 每个人进入竞技场后,会等概率随机匹配一个人,匹配到的人与当前胜利和失败场数无关. 胜利达到x场,或失败达到y场后,退出竞技场,根据退出时的胜利场数获得奖励,不能中途放弃. 水平高的 ...
- Qt(MinGW版)在win7 64位上无法播放视频解决方案
[原因分析] Qt自带的MinGW是32位版本,不支持64位的ffmpeg(解码器). 无法播放视频,问题就出在opencv_ffmpeg2411_64.dll(opencv\bin\)上. [解决方 ...
- marquee标签的使用
marquee语法 <marquee></marquee> 实例一<marquee>Hello, World</marquee> marquee常 ...
- python json相关问题
关于字典和字符转化问题. 1.使用eval()(一般不推荐) eval is evil. 这种方法可能直接执行恶意代码. 2.使用json.loads()(极度推荐) 这种方法是推荐的,但是要注意细节 ...
- C语言 变量的作用域和生命周期(转)
转自 https://blog.csdn.net/u011616739/article/details/62052179 a.普通局部变量 属于某个{},在{}外部不能使用此变量,在{}内部是可以使用 ...
- 手机端开发,基础设置1-body-fontsize
一.设计稿设计大小按照750设计. 二.单位使用rem,相对于body fontsize 相对大小计算. 三.假设750下,body fontsize 为100,为了方便计算. 四.通过设置当前设备 ...
- python的socket解析
1.实现一对一的进行沟通交流 (1).服务端代码如下: import socket server = socket.socket() server.bind(("localhost" ...
- 一张图11招学会Python网络黑客
全部学起来: 第一招:搭建Python防范环境 第二招:扫描漏洞 第三招:暴力破解的秘密 第四招:防SQL注入 第五招:防命令注入 第六招:看清文件上传木马 第七招:看清Web攻击 第八招:利用Pyt ...
- Android防止手动添加的本地库文件被NDK工具清理掉
比如要添加一个名为libocr的本地库,先将libocr.so文件拷贝到jni目录下,然后在Android.mk文件中添加以下语句即可. 例: LOCAL_PATH := $(call my-dir) ...