writing-promise

Have you actually written a promise yourself?

Have you thought about these questions?

  • What is a promise?
  • What is the meaning of the birth of promises, and why do they exist?
  • What are promise’s apis?
  • How do you use these apis? (MDN has detailed usage, but not too detailed)
  • Ultimate solution async/await use!
  • Write a promise!

What is promise?

A Promise is a constructor that encapsulates an asynchronous operation and retrieves its result

What is the meaning of the birth of promises, and why do they exist?

Before PROMISE: You must specify a Promise before starting the asynchronous task: Start the asynchronous task => return the ProMIE object => Bind callback functions to the Promise object (you can even specify/multiple callback functions after the asynchronous task ends) 2. Support for chained calls to solve the problem of callback hell what is callback hell? Callback function nested calls, external callback function asynchronous execution results in nested callback function execution of conditional callback hell disadvantage? Not easy to read/not easy exception handling solution? Promise chain call ultimate solution? async/await

What are promise’s apis?

1.Promise (excutor) {} 2.Promise.prototype. (onResolved onRejected) = > {} 3. Promise. Prototype. Catch method: (onRejected) = > {} 4. Promise. The resolve method: (value) => {} 6.Promise: (promises) => {} 7.Promise: (promises) => {}

Write a promise!

/** * custom Promsie function */ (function(window) {const PENDING = 'PENDING '; const RESOLVED = 'resolved'; const REJECTED = 'rejected'; class Promise { constructor(excutor) { const self = this; self.status = PENDING; Self. data = undefined; // The Promise object specifies a property to store the result data self.callbacks = []; Resolve (value) {if (self.status === PENDING) {self.status = RESOLVED; self.data = value; If (self.callbacks. Length > 0) {setTimeout(() => {// Emulate the macro queue task self.callbacks. ForEach ((callbanckObj) => { callbanckObj.onResolved(value); }); }); } } } function reject(reason) { if (self.status === PENDING) { self.status = REJECTED; self.data = reason; If (self.callbacks. Length > 0) {setTimeout(() => {// Emulate the macro queue task self.callbacks. ForEach ((callbanckObj) => { callbanckObj.onRejected(reason); }); }); } } } try { excutor(resolve, reject); } catch (error) { reject(error); }} /** * The Promise prototype object then() * returns a new Promise */ then(onResolved, onRejected) {const self = this; onResolved = typeof onResolved === 'function' ? onResolved : value => value; onRejected = typeof onRejected === 'function' ? onRejected : reason => { throw reason }; return new Promise((resolve, reject) => { function handle(callback) { try { const result = callback(self.data); if (result instanceof Promise) { result.then(resolve, reject); } else { resolve(result); } } catch (error) { reject(error); } } if (self.status === PENDING) { self.callbacks.push({ onResolved() { handle(onResolved); }, onRejected() { handle(onRejected); }}); } else if (self.status === RESOLVED) { setTimeout(() => { handle(onResolved); }); } else if (self.status === REJECTED) { setTimeout(() => { handle(onRejected); }); }}); Return this. Then (undefined, onRejected); return this. Then (undefined, onRejected); } /** * static resolve = function (value) {return new Promise((resolve, resolve)); reject) => { if (value instanceof Promise) { value.then(resolve, reject); } else { resolve(value); }}); Reject () {reject(); reject(); reject(); reject(); reject();  reject) => { reject(reason); }); } /** * The Promise function object all() * returns a Promsise that succeeds only if all promises succeed, */ static all = function (promises) {const values = new Array(promises. Length); let count = 0; return new Promise((resolve, reject) => { promises.forEach((promise, index) => { Promise.resolve(promise).then( value => { count++; values[index] = value; if (count === promises.length) { resolve(values); } }, reason => { reject(reason); })})}); } /** * The Promise function object race() * returns a Promsise, Static race = function (promises) {return new promise ((resolve, resolve, promise); reject) => { promises.forEach(promise => { Promise.resolve(promise).then(resolve, reject); }); }); }} // Expose the Promise function window.Promise = Promise; })(window);Copy the code