code

最近在思考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的实现(一)的更多相关文章

  1. 简易promise

    <!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8" ...

  2. 实现简易Promise

    概述 异步编程离不开promise, async, 事件响应这些东西,为了更好地异步编程,我打算探究一下promise的实现原理,方法是自己实现一个简易的promise. 根据promise mdn上 ...

  3. 简易promise的实现(二)

    code 上一章中我们遇到了两个问题 1.异步调用顺序的问题 2.then返回一个promise的问题 思考 如果控制异步回调的顺序? 因为异步操的时间作我们无法控制,但是我们只需要按顺序执行回调函数 ...

  4. ES6之promise原理

    我在这里介绍了promise的原理: https://juejin.im/post/5cc54877f265da03b8585902 我在这里 仅仅张贴 我自己实现的简易promise——DiProm ...

  5. 用JavaScript完成页面自动操作

    在之前的一篇<JavaScript实现按键精灵>中曾记录了几个事件对象,本文将会对它们进行一次实战,要完成的动作包括滚动.点击和翻页. 一.滚动 滚动是通过修改容器元素的scrollTop ...

  6. Promise实现简易AMD加载器

    在最新的Chrome和FF中已经 实现了Promise.有了Promise我们用数行代码即可实现一个简易AMD模式的加载器 var registry = { promises: { }, resolv ...

  7. 10行代码实现简易版的Promise

    实现之前,我们先看看Promise的调用 const src = 'https://img-ph-mirror.nosdn.127.net/sLP6rNBbQhy0OXFNYD9XIA==/79910 ...

  8. 手写简易版Promise

    实现一个简易版 Promise 在完成符合 Promise/A+ 规范的代码之前,我们可以先来实现一个简易版 Promise,因为在面试中,如果你能实现出一个简易版的 Promise 基本可以过关了. ...

  9. 手写Promise简易版

    话不多说,直接上代码 通过ES5的模块化封装,向外暴露一个属性 (function(window){ const PENDING = 'pending'; const RESOLVED = 'fulf ...

随机推荐

  1. ADC采样工作原理详解

    如何利用单片机的ADC模块(或者独立的ADC芯片)得到接入ADC管脚上的实际电压值?这个问题,是第一次接触ADC时候,大家都会遇到的问题.会读到什么值单片机会读到什么值?需要看一个特性,就是几位的AD ...

  2. Security+高分考过经验分享812分

    Security +也是无意中从谷安的宣传单知道的,本来就是想从事安全的行业,而且Security +含金量高,是国际认可的认证就想着去考一考试试. 大概从2018.12开始正式准备的,前面时间都是停 ...

  3. Unity 子弹移动以及碰撞条件

    一.子弹移动 游戏物体移动最主要的是获取一个刚体组件,再对这个刚体组件添加一个向前的力: 具体代码: public class BulletCtrl : MonoBehaviour { ; publi ...

  4. appache 在windows 中无法启动的测试

    使用phpstudy刚启动就自动停止,排除端口被占用后,总感觉找不到好的调试方法 网上找了一些资料,这个方法不错,所以就记录了下来.最好的办法是找appache的bin目录,打开运行,输入httpd. ...

  5. 细说Cookie--转

    Cookie虽然是个很简单的东西,但它又是WEB开发中一个很重要的客户端数据来源,而且它可以实现扩展性很好的会话状态, 所以我认为每个WEB开发人员都有必要对它有个清晰的认识.本文将对Cookie这个 ...

  6. openssl实现自签名证书

    前言 证书的作用 加密通信数据,验证对象身份,保证数据完整性 什么是自签名证书 公认的证书往往都需要收费,如果客户端与服务端都是由我们自己来操控,那便可以使用自签名证书(说白了就是只是自己认可的证书) ...

  7. day23单例模式 , 日志处理 , 项目结构目录

    # day23笔记 ## 一.补充,作业 ### 1.字符串格式化 ```pythonmsg = "我是%(n1)s,年龄%(n2)s" % {'n1': 'alex', 'n2' ...

  8. VMware 常见问题及解决办法

    Ø  简介 本文介绍使用 VMware 虚拟机时常见的问题及解决办法,主要包括: 1.   虚拟机操作系统装好后,每次进入虚拟机还进入安装程序 2.   虚拟机不能与主机复制粘帖 3.   解决错误: ...

  9. 关于js dtGrid报错长度的问题

    错误js截图 Uncaught TypeError: Cannot read property 'length' of undefined 翻译:Uncaught TypeError:无法读取未定义的 ...

  10. IDEA (mac版)

    mac键:option=alt command=ctrl idea快捷键 command+Enter(get,set界面) command+alt+L (格式化代码) ctrl+shift+space ...