简易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 ...
随机推荐
- ADC采样工作原理详解
如何利用单片机的ADC模块(或者独立的ADC芯片)得到接入ADC管脚上的实际电压值?这个问题,是第一次接触ADC时候,大家都会遇到的问题.会读到什么值单片机会读到什么值?需要看一个特性,就是几位的AD ...
- Security+高分考过经验分享812分
Security +也是无意中从谷安的宣传单知道的,本来就是想从事安全的行业,而且Security +含金量高,是国际认可的认证就想着去考一考试试. 大概从2018.12开始正式准备的,前面时间都是停 ...
- Unity 子弹移动以及碰撞条件
一.子弹移动 游戏物体移动最主要的是获取一个刚体组件,再对这个刚体组件添加一个向前的力: 具体代码: public class BulletCtrl : MonoBehaviour { ; publi ...
- appache 在windows 中无法启动的测试
使用phpstudy刚启动就自动停止,排除端口被占用后,总感觉找不到好的调试方法 网上找了一些资料,这个方法不错,所以就记录了下来.最好的办法是找appache的bin目录,打开运行,输入httpd. ...
- 细说Cookie--转
Cookie虽然是个很简单的东西,但它又是WEB开发中一个很重要的客户端数据来源,而且它可以实现扩展性很好的会话状态, 所以我认为每个WEB开发人员都有必要对它有个清晰的认识.本文将对Cookie这个 ...
- openssl实现自签名证书
前言 证书的作用 加密通信数据,验证对象身份,保证数据完整性 什么是自签名证书 公认的证书往往都需要收费,如果客户端与服务端都是由我们自己来操控,那便可以使用自签名证书(说白了就是只是自己认可的证书) ...
- day23单例模式 , 日志处理 , 项目结构目录
# day23笔记 ## 一.补充,作业 ### 1.字符串格式化 ```pythonmsg = "我是%(n1)s,年龄%(n2)s" % {'n1': 'alex', 'n2' ...
- VMware 常见问题及解决办法
Ø 简介 本文介绍使用 VMware 虚拟机时常见的问题及解决办法,主要包括: 1. 虚拟机操作系统装好后,每次进入虚拟机还进入安装程序 2. 虚拟机不能与主机复制粘帖 3. 解决错误: ...
- 关于js dtGrid报错长度的问题
错误js截图 Uncaught TypeError: Cannot read property 'length' of undefined 翻译:Uncaught TypeError:无法读取未定义的 ...
- IDEA (mac版)
mac键:option=alt command=ctrl idea快捷键 command+Enter(get,set界面) command+alt+L (格式化代码) ctrl+shift+space ...