如何手动封装Promise函数
function Promise(task) {
// 缓存this
let that = this
// 进行中的状态
this.status = 'pending'
//初始值
this.value = undefined
// 存放成功后要执行的回调函数的序列
that.onResolvedCallbacks = []
// 存放失败后要执行的回调函数的序列
that.onRejectCallbacks = []
// 该方法将Promise由pending变为fulfiled
function resolve(value) {
if(that.status == 'pending') {
that.status = 'fulfiled'
that.value = value
that.onResolvedCallbacks.forEach(cb => cb(that.value))
}
}
// 该方法是将Promise由pending变成rejected
function reject(reason) {
if(that.status == 'pending') {
that.status = 'rejected'
that.value = reason
that.onRejectCallbacks.forEach(cb => cb(that.value))
}
}
try {
// 每一个Promise在new一个实例的时候 接受的函数都是立即执行的
task(resolve, reject)
} catch(e) {
reject(e)
}
}
Promise.prototype.then = function(onFulfilled, onRejected) {
if(this.status == 'fulfiled') {
onFulfilled(this.value)
}
if(this.status == 'rejected') {
onRejected(this.value)
}
if (this.status == 'pending') {
this.onResolvedCallbacks.push(onFulfilled(this.value));
this.onRejectCallbacks.push(onRejected(this.value));
}
}
new Promise(function (resolve, reject) {
resolve(100);// reject(100)
}).then(function (data) {
console.log('666', data)
})
如何手动封装Promise函数的更多相关文章
- 使用promise手动封装ajax函数
最近在做一个单页应用,node和浏览器仅通过json传输数据,因为是只有自己用等于是锻炼一下自己,所以也不用考虑seo的问题,node端我已经写好了,但是浏览器端想要用ajax原生太麻烦,用封装的函数 ...
- 封装原生promise函数
阿里面试题: 手动封装promise函数 <!DOCTYPE html> <html lang="en"> <head> <meta ch ...
- Thinkphp3.2.3框架下封装公共的函数,例如封装CURL函数来获取接口数据
当我们需要在控制层调用相同的封装函数时,写多次相同的函数,显得代码十分的拉杂,不精简: TP框架有一个很好的机制,可以再Common定义一个function.php函数,当我们在控制层调用的时候直接调 ...
- 手动封装AJAX
正常函数的调用 <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...
- 【Vue】---- 手动封装on,emit,off
一.概念 1. $on("事件名称",回调函数) 事件绑定,一个事件名称上面可能绑定多个函数 2. $emit("事件名称",需要传递的值) 事件触发时,会触发 ...
- jQuery编写插件--封装全局函数的插件(一些常用的js验证表达式)
上一篇写到了jQuery插件的3种类型,介绍了第一种类型的写法--封装jQuery对象的方法插件.这一篇要介绍第二种插件类型:封装全局函数的插件:这类插件就是在jQuery命名空间内部添加函数:这类插 ...
- Thinkphp框架下封装文件下载函数
第一步:开启php_fileinfo.dll 方法:打开php.ini,将874行的;extension=php_fileinfo.dll前面的分号注释去掉即可: 第二步:控制层封装文件下载函数 fu ...
- 封装PDO函数
funPDO.php <?php /** * @title: 封装PDO函数 * * @Features: * 1. 封装 SELECT ,INSERT,DELETE,UPDATE 操作 @do ...
- 原生javascript封装的函数
1.javascript 加载的函数 window.onload = function(){} 2.封装的id函数 function $(id) { return document.getElemen ...
随机推荐
- esp-01与esp-01s的区别 ESP8288-01S与ESP8288-01的区别
ESP8266系列Wi-Fi模块一共有01-14十多款模块, ESP8266-01简称ESP-01, ESP8266-01S简称ESP-01S 至于他们的区别请看下图:左边的是ESP8266-01S, ...
- 虚拟机安装Ubuntu 16.04系统实操教程 详尽步骤 vmware ESXi亲测通过
1 Ubuntu 16.04系统安装要求 Ubuntu 16.04 LTS下载最新版本的Ubuntu,适用于台式机和笔记本电脑. LTS代表长期支持,这意味着有五年免费安全和维护更新的保证. Ubun ...
- Hbase集群模式搭建
1.官网下载hbase安装包 这里不做赘述. 2.解压---直接tar -zxvf xxxx 3.配置hbase集群,要修改3个文件(首先zk集群已经安装好了) 注意:要把hadoop的hdfs-si ...
- kafka如何保证消息得顺序性
1. 问题 比如说我们建了一个 topic,有三个 partition.生产者在写的时候,其实可以指定一个 key,比如说我们指定了某个订单 id 作为 key,那么这个订单相关的数据,一定会被分发到 ...
- 「译」Blazor VS React React / Angular / Vue.js
原文作者: Christian Findlay 原文链接: https://christianfindlay.com/2020/06/04/blazor-vs-react-angular-vue-js ...
- umi3.2+ targets ie不生效的问题
直接创建umi项目 config.ts对targets{ie:11}不生效 错误方法1: 在入口页app.tsx新增 import @babel/polyfill 错误方法2: 在入口页app.tsx ...
- 工具用的好,下班回家早!5分钟玩转iTerm2!
同时打开多个终端窗口,来回切换太麻烦! 能不能像IDEA一样,能够查看历史粘贴记录? 有没有办法一键登陆服务器? 工欲善其事,必先利其器!无论工作还是学习,选择好用的工具真的太重要了.今天就给大家介绍 ...
- vue中选中弹出框内的表格
一:可多选情况且对应勾选 由于是弹出框形式,所以会出现新增DOM与数据的改变问题,因此要使用$nextTick,不然一开始弹出得时候DOM还没有生成,却要获取DOM会报错:这种多选情况会出现一个bug ...
- C++中的extern“C”
首先引入extern"C"的官方解释 extern "C" is meant to be recognized by a C++ compiler and to ...
- 代码审计 - BugkuCTF
extract变量覆盖: 相关函数: extract()函数:从数组中将变量导入到当前的符号表.把数组键名作为变量名,数组的键值作为变量值.但是当变量中有同名的元素时会默认覆盖掉之前的变量值. tri ...