本文已参与[新人创作礼]活动,一起开启掘金创作之路
1.
class Promise{
//因为promise是一个类所以用class声明(类是为了实现面向对象,创建了特殊的近类结构)
constructor(executor){
//因为new Promise((resolve, reject)=>{})所以需要传参,executor作为参数表示立即执行 每个class中都有一个constructor构造器
//成功
let resolve=()=>{
}
//失败
let reject=()=>{
};
// 如果executor执行报错,直接执行reject
executor(resolve,reject) ;
}
}
2.
class Promise{
constructor(executor){
// 初始态state为等待态
this.state='pending';//(state当前状态)
// 成功的值(不可转为其他状态)
this.value=undefined;
// 初始化value
this.reason=undefined;
//初始化结果
//成功
let resolve=value=>{
// 判断state
if(this.state==='pending'){
// resolve调用后,state为成功态fulfilled
this.state='fulfilled';
// 储存成功的值
this.value=value;
};
}
//失败
let reject=reason=>{
// satate改变,reject调用就会失败
if(this.state==='pending'){
// reject调用后,state转为失败态
this.state='rejected';
// 储存失败的原因
this.reason=reason;
}
};
// 如果executor执行报错,直接执行reject
try{
executor(resolve,reject) ;
//立即执行
}catch(err){
reject(err)
}
}
// then方法 有两个参数 onFulfilled onRejected
then(onFulfilled,onRejected){
// 状态为fulfilled,执行onFulfilled,传入成功的值
if(this.state==='fulfilled'){
onFulfilled(this.value);
};
// 状态为rejected,执行onRejected,传入失败的原因
if(this.state==='Rejected'){
onRejected(this.value);
};
}
}
3.
class Promise{
constructor(executor){
this.state='pending';
this.value=undefined;
this.reason=undefined;
// 成功存放的数组
this.onResolvedCallbacks=[];
// 失败存放的数组
this.onRejectedCallbacks=[];
let resolve=value=>{
if(this.state==='pending'){
this.state='fulfilled';
this.value=value;
// 一旦resolve执行,调用成功数组中的函数
this.onResolvedCallbacks.forEach(fn=>fn());
};
}
let reject=reason=>{
if(this.state==='pending'){
this.state='rejected';
this.reason=reason;
//一旦reject执行,调用失败数组的函数
this.onRejectedCallbacks.forrEach(fn=>fn());
}
};
try{
executor(resolve,reject) ;
}catch(err){
reject(err)
}
}
then(onFulfilled,onRejected){
if(this.state==='fulfilled'){
onFulfilled(this.value);
};
if(this.state==='Rejected'){
onRejected(this.reason);
};
// 当状态state为pending时
if(this.state==='pending'){
// onFulfilled传入成功数组
this.onResolvedCallbacks.push(()=>{ //数组不能直接存函数,可以将函数用对象包裹起来,箭头函数恰恰可以做到
onFulfilled(this.value);
})
// onRejected传入到失败数组
this.onRejectedCallbacks.push(()=>{
onRejected(this.reason);
})
}
}
}
4.
class Promise{
constructor(executor){
this.state='pending';
this.value=undefined;
this.reason=undefined;
this.onResolvedCallbacks=[];
this.onRejectedCallbacks=[];
let resolve=value=>{
if(this.state==='pending'){
this.state='fulfilled';
this.value=value;
this.onResolvedCallbacks.forEach(fn=>fn());
};
}
let reject=reason=>{
if(this.state==='pending'){
this.state='rejected';
this.reason=reason;
this.onRejectedCallbacks.forrEach(fn=>fn());
}
};
try{
executor(resolve,reject) ;
}catch(err){
reject(err)
}
}
then(onFulfilled,onRejected){
// 声明返回的promise2
let promise2 = new Promise((resolve,reject)=>{
if(this.state==='fulfilled'){
let x= onFulfilled(this.value);
// resolvePromise函数,处理自己return的promise和默认的promise2的关系
resolvePromise(promise2,x,resolve,reject);
};
if(this.state==='Rejected'){
let x= onRejected(this.reason);
resolvePromise(promise2,x,resolve,reject);
};
if(this.state==='pending'){
this.onResolvedCallbacks.push(()=>{
let x= onFulfilled(this.value);
resolvePromise(promise2,x,resolve,reject);
})
this.onRejectedCallbacks.push(()=>{
let x= onRejected(this.reason);
resolvePromise(promise2,x,resolve,reject);
})
}
})
// 返回promise,完成链式
return promise2;
}
}
5.
class Promise{
constructor(executor){
this.state='pending';
this.value=undefined;
this.reason=undefined;
this.onResolvedCallbacks=[];
this.onRejectedCallbacks=[];
let resolve=value=>{
if(this.state==='pending'){
this.state='fulfilled';
this.value=value;
this.onResolvedCallbacks.forEach(fn=>fn());
};
}
let reject=reason=>{
if(this.state==='pending'){
this.state='rejected';
this.reason=reason;
this.onRejectedCallbacks.forrEach(fn=>fn());
}
};
try{
executor(resolve,reject) ;
}catch(err){
reject(err)
}
}
then(onFulfilled,onRejected){
// 声明返回的promise2
let promise2 = new Promise((resolve,reject)=>{
if(this.state==='fulfilled'){
let x= onFulfilled(this.value);
// resolvePromise函数,处理自己return的promise和默认的promise2的关系
resolvePromise(promise2,x,resolve,reject);
};
if(this.state==='Rejected'){
let x= onRejected(this.reason);
resolvePromise(promise2,x,resolve,reject);
};
if(this.state==='pending'){
this.onResolvedCallbacks.push(()=>{
let x= onFulfilled(this.value);
resolvePromise(promise2,x,resolve,reject);
})
this.onRejectedCallbacks.push(()=>{
let x= onRejected(this.reason);
resolvePromise(promise2,x,resolve,reject);
})
}
})
// 返回promise,完成链式
return promise2;
}
}
function resolvePromise(promise2,x,resolve,reject){
// 循环引用报错
if(x===promise2){
// reject报错
return reject(new TypeError('Chaining cycle detected for promise'));
}
// 防止多次调用
let called;
// x不是null 且x是对象或函数
if(x!=null&&(typeof x==='object'||typeof x==='function')){
try {
// A+规定,声明then=x的then方法
let then=x.then;
// 如果then是函数,就默认是promise了
if(typeof then==='function'){
// 就让then执行第一个参数是this 后面是成功的回调和失败的回调
then.call(x,y=>{
// 成功和失败只能调用一个
if(called) return;
called=true;
// resolve的结果依旧是promise,那就继续解析
resolvePromise(promise2,y,resolve,reject);
},err=>{
// 成功和失败只能调用一个
if(called) return;
called=true;
reject(err);//失败
})
}else{
resolve(x);//成功
}
}catch(e){
// 也属于失败
if(called) return;
called=true;
// 取then出错了那就不要再继续执行的
reject(e);
}
}else{
resolve(x)
}
}
6.
class Promise{
constructor(executor){
this.state = 'pending';
this.value = undefined;
this.reason = undefined;
this.onResolvedCallbacks = [];
this.onRejectedCallbacks = [];
let resolve = value => {
if (this.state === 'pending') {
this.state = 'fulfilled';
this.value = value;
this.onResolvedCallbacks.forEach(fn=>fn());
}
};
let reject = reason => {
if (this.state === 'pending') {
this.state = 'rejected';
this.reason = reason;
this.onRejectedCallbacks.forEach(fn=>fn());
}
};
try{
executor(resolve, reject);
} catch (err) {
reject(err);
}
}
then(onFulfilled,onRejected) {
// onFulfilled如果不是函数,就忽略onFulfilled,直接返回value
onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : value => value;
// onRejected如果不是函数,就忽略onRejected,直接扔出错误
onRejected = typeof onRejected === 'function' ? onRejected : err => { throw err };
let promise2 = new Promise((resolve, reject) => {
if (this.state === 'fulfilled') {
// 异步
setTimeout(() => {
try {
let x = onFulfilled(this.value);
resolvePromise(promise2, x, resolve, reject);
} catch (e) {
reject(e);
}
}, 0);
};
if (this.state === 'rejected') {
// 异步
setTimeout(() => {
// 如果报错
try {
let x = onRejected(this.reason);
resolvePromise(promise2, x, resolve, reject);
} catch (e) {
reject(e);
}
}, 0);
};
if (this.state === 'pending') {
this.onResolvedCallbacks.push(() => {
// 异步
setTimeout(() => {
try {
let x = onFulfilled(this.value);
resolvePromise(promise2, x, resolve, reject);
} catch (e) {
reject(e);
}
}, 0);
});
this.onRejectedCallbacks.push(() => {
// 异步
setTimeout(() => {
try {
let x = onRejected(this.reason);
resolvePromise(promise2, x, resolve, reject);
} catch (e) {
reject(e);
}
}, 0)
});
};
});
// 返回promise,完成链式
return promise2;
}
}
7.
class Promise{
constructor(executor){
this.state = 'pending';
this.value = undefined;
this.reason = undefined;
this.onResolvedCallbacks = [];
this.onRejectedCallbacks = [];
let resolve = value => {
if (this.state === 'pending') {
this.state = 'fulfilled';
this.value = value;
this.onResolvedCallbacks.forEach(fn=>fn());
}
};
let reject = reason => {
if (this.state === 'pending') {
this.state = 'rejected';
this.reason = reason;
this.onRejectedCallbacks.forEach(fn=>fn());
}
};
try{
executor(resolve, reject);
} catch (err) {
reject(err);
}
}
then(onFulfilled,onRejected) {
onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : value => value;
onRejected = typeof onRejected === 'function' ? onRejected : err => { throw err };
let promise2 = new Promise((resolve, reject) => {
if (this.state === 'fulfilled') {
setTimeout(() => {
try {
let x = onFulfilled(this.value);
resolvePromise(promise2, x, resolve, reject);
} catch (e) {
reject(e);
}
}, 0);
};
if (this.state === 'rejected') {
setTimeout(() => {
try {
let x = onRejected(this.reason);
resolvePromise(promise2, x, resolve, reject);
} catch (e) {
reject(e);
}
}, 0);
};
if (this.state === 'pending') {
this.onResolvedCallbacks.push(() => {
setTimeout(() => {
try {
let x = onFulfilled(this.value);
resolvePromise(promise2, x, resolve, reject);
} catch (e) {
reject(e);
}
}, 0);
});
this.onRejectedCallbacks.push(() => {
setTimeout(() => {
try {
let x = onRejected(this.reason);
resolvePromise(promise2, x, resolve, reject);
} catch (e) {
reject(e);
}
}, 0)
});
};
});
return promise2;
}
catch(fn){
return this.then(null,fn);
}
}
function resolvePromise(promise2, x, resolve, reject){
if(x === promise2){
return reject(new TypeError('Chaining cycle detected for promise'));
}
let called;
if (x != null && (typeof x === 'object' || typeof x === 'function')) {
try {
let then = x.then;
if (typeof then === 'function') {
then.call(x, y => {
if(called)return;
called = true;
resolvePromise(promise2, y, resolve, reject);
}, err => {
if(called)return;
called = true;
reject(err);
})
} else {
resolve(x);
}
} catch (e) {
if(called)return;
called = true;
reject(e);
}
} else {
resolve(x);
}
}
//resolve方法
Promise.resolve = function(val){
return new Promise((resolve,reject)=>{
resolve(val)
});
}
//reject方法
Promise.reject = function(val){
return new Promise((resolve,reject)=>{
reject(val)
});
}
//race方法
Promise.race = function(promises){
return new Promise((resolve,reject)=>{
for(let i=0;i<promises.length;i++){
promises[i].then(resolve,reject)
};
})
}
//all方法(获取所有的promise,都执行then,把结果放到数组,一起返回)
Promise.all = function(promises){
let arr = [];
let i = 0;
function processData(index,data){
arr[index] = data;
i++;
if(i == promises.length){
resolve(arr);
};
};
return new Promise((resolve,reject)=>{
for(let i=0;i<promises.length;i++){
promises[i].then(data=>{
processData(i,data);
},reject);
};
});
}
8.
class Promise{
constructor(executor){
this.state = 'pending';
this.value = undefined;
this.reason = undefined;
this.onResolvedCallbacks = [];
this.onRejectedCallbacks = [];
let resolve = value => {
if (this.state === 'pending') {
this.state = 'fulfilled';
this.value = value;
this.onResolvedCallbacks.forEach(fn=>fn());
}
};
let reject = reason => {
if (this.state === 'pending') {
this.state = 'rejected';
this.reason = reason;
this.onRejectedCallbacks.forEach(fn=>fn());
}
};
try{
executor(resolve, reject);
} catch (err) {
reject(err);
}
}
then(onFulfilled,onRejected) {
onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : value => value;
onRejected = typeof onRejected === 'function' ? onRejected : err => { throw err };
let promise2 = new Promise((resolve, reject) => {
if (this.state === 'fulfilled') {
setTimeout(() => {
try {
let x = onFulfilled(this.value);
resolvePromise(promise2, x, resolve, reject);
} catch (e) {
reject(e);
}
}, 0);
};
if (this.state === 'rejected') {
setTimeout(() => {
try {
let x = onRejected(this.reason);
resolvePromise(promise2, x, resolve, reject);
} catch (e) {
reject(e);
}
}, 0);
};
if (this.state === 'pending') {
this.onResolvedCallbacks.push(() => {
setTimeout(() => {
try {
let x = onFulfilled(this.value);
resolvePromise(promise2, x, resolve, reject);
} catch (e) {
reject(e);
}
}, 0);
});
this.onRejectedCallbacks.push(() => {
setTimeout(() => {
try {
let x = onRejected(this.reason);
resolvePromise(promise2, x, resolve, reject);
} catch (e) {
reject(e);
}
}, 0)
});
};
});
return promise2;
}
catch(fn){
return this.then(null,fn);
}
}
function resolvePromise(promise2, x, resolve, reject){
if(x === promise2){
return reject(new TypeError('Chaining cycle detected for promise'));
}
let called;
if (x != null && (typeof x === 'object' || typeof x === 'function')) {
try {
let then = x.then;
if (typeof then === 'function') {
then.call(x, y => {
if(called)return;
called = true;
resolvePromise(promise2, y, resolve, reject);
}, err => {
if(called)return;
called = true;
reject(err);
})
} else {
resolve(x);
}
} catch (e) {
if(called)return;
called = true;
reject(e);
}
} else {
resolve(x);
}
}
Promise.resolve = function(val){
return new Promise((resolve,reject)=>{
resolve(val)
});
}
Promise.reject = function(val){
return new Promise((resolve,reject)=>{
reject(val)
});
}
Promise.race = function(promises){
return new Promise((resolve,reject)=>{
for(let i=0;i<promises.length;i++){
promises[i].then(resolve,reject)
};
})
}
Promise.all = function(promises){
let arr = [];
let i = 0;
function processData(index,data){
arr[index] = data;
i++;
if(i == promises.length){
resolve(arr);
};
};
return new Promise((resolve,reject)=>{
for(let i=0;i<promises.length;i++){
promises[i].then(data=>{
processData(i,data);
},reject);
};
});
}
// 语法糖
Promise.defer = Promise.deferred = function () {
let dfd = {}
dfd.promise = new Promise((resolve,reject)=>{
dfd.resolve = resolve;
dfd.reject = reject;
});
return dfd;
}
module.exports = Promise;
//npm install promises-aplus-tests 用来测试自己的promise 符不符合promisesA+规范
// 命令行 promises-aplus-tests js文件名