博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Promise源码深入理解
阅读量:6948 次
发布时间:2019-06-27

本文共 5736 字,大约阅读时间需要 19 分钟。

// promise的第一版实现
function
myPromise(
constructor) {
let
self =
this;
self.
status =
"pending"
//定义状态改变前的初始状态
self.
value =
undefined;
//定义状态为resolved的时候的状态
self.
reason =
undefined;
//定义状态为rejected的时候的状态
function
resolve(
value) {
//两个==="pending",保证了状态的改变是不可逆的
console.
log(
222)
if (
self.
status ===
"pending") {
self.
value =
value;
self.
status =
"resolved";
}
}
function
reject(
reason) {
//两个==="pending",保证了状态的改变是不可逆的
if (
self.
status ===
"pending") {
self.
reason =
reason;
self.
status =
"rejected";
}
}
//捕获构造异常
try {
constructor(
resolve,
reject);
}
catch (
e) {
reject(
e);
}
}
myPromise.
prototype.
then =
function (
onFullfilled,
onRejected) {
let
self =
this;
console.
log(
'78878' +
self.
status)
switch (
self.
status) {
case
"resolved":
onFullfilled(
self.
value);
break;
case
"rejected":
onRejected(
self.
reason);
break;
default:
}
}
var
p =
new
myPromise(
function (
resolve,
reject) {
resolve(
1) });
p.
then(
function (
x) {
console.
log(
x)
})
//输出1
// mypromise 无法执行异步的resolve
var
p =
new
myPromise(
function (
resolve,
reject) {
setTimeout(
function () {
console.
log(
'thisthisthis================' +
this)
resolve(
1)
},
1000)
});
p.
then(
function (
x) {
console.
log(
x) })
//无输出
// 2, 基于观察者
function
myPromise(
constructor) {
let
self =
this;
self.
status =
"pending"
//定义状态改变前的初始状态
self.
value =
undefined;
//定义状态为resolved的时候的状态
self.
reason =
undefined;
//定义状态为rejected的时候的状态
console.
log(
'55566567676')
self.
onFullfilledArray = [];
self.
onRejectedArray = [];
function
resolve(
value) {
console.
log(
232323)
if (
self.
status ===
"pending") {
self.
value =
value;
self.
status =
"resolved";
self.
onFullfilledArray.
forEach(
function (
f) {
// self.value
console.
log(
'value==================' +
self.
value)
f();
//如果状态从pending变为resolved,
//那么就遍历执行里面的异步方法
});
}
}
function
reject(
reason) {
if (
self.
status ===
"pending") {
self.
reason =
reason;
self.
status =
"rejected";
self.
onRejectedArray.
forEach(
function (
f) {
f(
self.
reason);
//如果状态从pending变为rejected,
//那么就遍历执行里面的异步方法
})
}
}
//捕获构造异常
try {
constructor(
resolve,
reject);
}
catch (
e) {
reject(
e);
}
}
myPromise.
prototype.
then =
function (
onFullfilled,
onRejected) {
let
self =
this;
console.
log(
'status==========' +
self.
status)
switch (
self.
status) {
case
"pending":
self.
onFullfilledArray.
push(
function () {
onFullfilled(
self.
value)
});
self.
onRejectedArray.
push(
function () {
onRejected(
self.
reason)
});
break;
case
"resolved":
onFullfilled(
self.
value);
break;
case
"rejected":
onRejected(
self.
reason);
break;
default:
}
}
var
p =
new
myPromise(
function (
resolve,
reject) {
setTimeout(
function () {
console.
log(
this)
resolve(
1)
},
1000)
});
p.
then(
function (
x) {
console.
log(
x) })
//无输出
// 3.v3.0then方法实现链式调用
myPromise.
prototype.
then =
function (
onFullfilled,
onRejected) {
let
self =
this;
let
promise2;
switch (
self.
status) {
case
"pending":
promise2 =
new
myPromise(
function (
resolve,
reject) {
self.
onFullfilledArray.
push(
function () {
try {
let
temple =
onFullfilled(
self.
value);
resolve(
temple)
}
catch (
e) {
reject(
e)
//error catch
}
});
self.
onRejectedArray.
push(
function () {
try {
let
temple =
onRejected(
self.
reason);
reject(
temple)
}
catch (
e) {
reject(
e)
// error catch
}
});
})
break;
case
"resolved":
promise2 =
new
myPromise(
function (
resolve,
reject) {
try {
let
temple =
onFullfilled(
self.
value);
//将上次一then里面的方法传递进下一个Promise的状态
resolve(
temple);
}
catch (
e) {
reject(
e);
//error catch
}
})
break;
case
"rejected":
promise2 =
new
myPromise(
function (
resolve,
reject) {
try {
let
temple =
onRejected(
self.
reason);
//将then里面的方法传递到下一个Promise的状态里
resolve(
temple);
}
catch (
e) {
reject(
e);
}
})
break;
default:
}
return
promise2;
}
var
p =
new
myPromise(
function (
resolve,
reject) {
setTimeout(
function () {
console.
log(
this)
resolve(
1)
},
1000)
});
p.
then(
function (
x) {
console.
log(
x)
})
//输出 1 链式调用1 链式调用2
// 4.v4.0 then函数中的onFullfilled和onRejected方法的返回值问题
function
resolvePromise(
promise,
x,
resolve,
reject) {
if (
promise ===
x) {
throw
new
TypeError(
"type error") }
let
isUsed;
if (
x !==
null && (
typeof
x ===
"object" ||
typeof
x ===
"function")) {
try {
let
then =
x.
then;
if (
typeof
then ===
"function") {
//是一个promise的情况
then.
call(
x,
function (
y) {
if (
isUsed)
return;
isUsed =
true;
resolvePromise(
promise,
y,
resolve,
reject);
},
function (
e) {
if (
isUsed)
return;
isUsed =
true;
reject(
e);
})
}
else {
//仅仅是一个函数或者是对象
resolve(
x)
}
}
catch (
e) {
if (
isUsed)
return;
isUsed =
true;
reject(
e);
}
}
else {
//返回的基本类型,直接resolve
resolve(
x)
}
}
myPromise.
prototype.
then =
function (
onFullfilled,
onRejected) {
let
self =
this;
let
promise2;
switch (
self.
status) {
case
"pending":
promise2 =
new
myPromise(
function (
resolve,
reject) {
self.
onFullfilledArray.
push(
function () {
setTimeout(
function () {
try {
let
temple =
onFullfilled(
self.
value);
resolvePromise(
temple)
}
catch (
e) {
reject(
e)
//error catch     
}
})
});
self.
onRejectedArray.
push(
function () {
setTimeout(
function () {
try {
let
temple =
onRejected(
self.
reason);
resolvePromise(
temple)
}
catch (
e) {
reject(
e)
// error catch     
}
})
});
})
case
"resolved":
promise2 =
new
myPromise(
function (
resolve,
reject) {
setTimeout(
function () {
try {
let
temple =
onFullfilled(
self.
value);
//将上次一then里面的方法传递进下一个Promise状态  
resolvePromise(
temple);
}
catch (
e) {
reject(
e);
//error catch
}
})
})
break;
case
"rejected":
promise2 =
new
myPromise(
function (
resolve,
reject) {
setTimeout(
function () {
try {
let
temple =
onRejected(
self.
reason);
//将then里面的方法传递到下一个Promise的状态里
resolvePromise(
temple);
}
catch (
e) {
reject(
e);
}
})
})
break;
default:
}
return
promise2;
}

转载于:https://www.cnblogs.com/yayaxuping/p/10193042.html

你可能感兴趣的文章
C#编写COM组件
查看>>
[OpenSource]浅谈.Net和Java互相调用的三种方式
查看>>
C语言指针的初始化和赋值
查看>>
安卓开发笔记——关于照片墙的实现(完美缓存策略LruCache+DiskLruCache)
查看>>
定义和使用EL函数
查看>>
android edittext不弹出软键盘
查看>>
关于正则表达式 C#
查看>>
【原创视频教程】SqlServer2008视频教程[共9集]
查看>>
Ubuntu 14.04 启用休眠
查看>>
Android闹钟源代码
查看>>
const使用摘要
查看>>
1.cocos2dx 3.2环境结构
查看>>
你知道什么是Grunt么?
查看>>
Java堆栈详解
查看>>
Hadoop入门进阶课程6--MapReduce应用案例
查看>>
SQL Server 2014里的IO资源调控器
查看>>
.NET足球赛事资料数据库平台SmartLottery开源发布——全球足球联赛应有尽有
查看>>
Eamcs ditaa基于字符图形产生的图像上
查看>>
Only the original thread that created a view hierarchy can touch its views.
查看>>
LeetCode手记-Add Binary
查看>>