This is the 4th day of my participation in the August More Text Challenge
preface
This article writes a basic version of promise to understand its common approach. The methods involved are then, all, race, resolve, Reject, finally, catch, Where all, race, resolve, reject are static methods, that is, add the static keyword in front of the method name (in this article, race, resolve, reject, finally, catch).
Race method
A static method that takes an array of parameters and returns a Promise. The state and value of the Promise are determined by the first item in the array parameters that completes the state change
Define the new Promise object to return. Perform an operation on each item in the parameter array. If the item is a Promise object, then the state change method of the new promise is indirectly triggered by its then method. If the item is a non-PROMISE object, the state of the new promise is assumed to be successful and the value is the item. Note here that non-promise objects are wrapped in a layer of asynchronous operations.
static race (arr) {
const racePromise = new MyPromise((resolve, reject) = > {
arr.forEach(item= > {
if (item instanceof MyPromise) {
item.then(resolve, reject);
} else {
queueMicrotask(() = > { // For non-PROMISE objects, a successful callback is determined, but a layer of asynchronous processing is added, because the state changes of promise are asynchronous, to ensure that the parameters in the array are triggered in the same orderresolve(item); }); }})});return racePromise;
}
Copy the code
Resolve method
Is a static method that takes an argument and returns a Promise. The state of the returned promise is related to the argument. If the argument is a Promise, the promise is returned directly. Otherwise, the new promise has a success state and a parameter value
static resolve (val) {
if (val instanceof MyPromise) return val;
return new MyPromise(resolve= > {
resolve(val);
});
}
Copy the code
Reject method
Is a static method that takes an argument and returns a Promise with a failed promise state and the value of the argument passed in
static reject (reason) {
return new MyPromise((resolve, reject) = > {
reject(reason);
});
}
Copy the code
The finally method
Takes an argument, executes it if it is a function and gets the return value; Return a promise with the same state and value as the promise that called the method. Build the returned promise directly using Peomise’s static resolve method.
finally (callback) {
let x = typeof callback === 'function' ? callback() : callback; // Make code fault tolerant to improve robustness
return MyPromise.resolve(x).then(() = > this);
// Why not write it like this
// 1, why use throw in error callback, because throw can save the current error state
// 2, MyPromise's then method is fault-tolerance for success and error callbacks. The current form of error callback is the same as the default error callback in then
// return MyPromise.resolve(x).then(() => this, reason => { throw reason });
}
Copy the code
Catch method
Receives an error callback function that only fires when a Promise error occurs, so receives the error callback directly through its own then method.
catch (onRejected) {
return this.then(null, onRejected);
}
Copy the code
reference
So much for writing Promise, suggestions are welcome. The source code is here