toujours

chatGPT에게 물어본 promise chaining 본문

카테고리 없음

chatGPT에게 물어본 promise chaining

toujours_ 2023. 2. 20. 02:26

 

 

 

 

 

 
when promises are chained by 'then()' method, where does the former return values go?
 

 

 

When Promises are chained by the then() method, the return values from the previous then() callback function are passed as the resolved value to the next then() callback function.

For example, consider the following code:

javascriptCopy code
const promise = new Promise((resolve, reject) => { resolve(1); }); promise.then((num) => { return num + 1; }).then((num) => { console.log(num); });

In this example, we create a new Promise that immediately resolves with the value 1. We then chain two then() methods. In the first then() method, we add 1 to the resolved value and return the result. In the second then() method, we log the resolved value to the console.

When the first then() callback function is executed, it returns a value of 2. This value is then passed as the resolved value to the second then() callback function, which logs the value to the console.

So in this case, the return value from the first then() callback function (2) is passed to the second then() callback function as the resolved value of the previous Promise. This is how values are passed from one then() callback function to the next in a Promise chain.

 
 
but I can't understand. I think 'promise.then(~)' is a promise. I want to see what it looks likes (the implementation).
 
 

Yes, you're correct that promise.then() returns a Promise. Here's an example implementation of the then() method to help illustrate how it works:

javascriptCopy code
Promise.prototype.then = function(onResolved, onRejected) { // If a callback function is not provided, we'll just pass the resolved value through onResolved = onResolved || function(value) { return value; }; // Save a reference to the current Promise object so we can return a new Promise object const currentPromise = this; // Create a new Promise object to be returned by this function const newPromise = new Promise((resolve, reject) => { // Register a callback function with the current Promise object currentPromise._registerCallbacks((result, isError) => { try { // Call the callback function provided to the then() method with the resolved value let callbackResult = isError ? onRejected(result) : onResolved(result); // If the callback function returns a Promise object, wait for it to be resolved before resolving the new Promise if (callbackResult instanceof Promise) { callbackResult.then(resolve, reject); } else { resolve(callbackResult); } } catch (err) { reject(err); } }); }); return newPromise; };

In this example implementation, we define a then() method on the Promise prototype. The then() method takes two arguments: onResolved, which is a callback function to be executed when the Promise is resolved, and onRejected, which is a callback function to be executed when the Promise is rejected (both of these arguments are optional).

When the then() method is called on a Promise object, it saves a reference to the current Promise object (currentPromise) and creates a new Promise object (newPromise) that will be returned by the then() method.

The then() method then registers a callback function with the current Promise object using the _registerCallbacks() method. This callback function will be executed when the Promise is resolved or rejected.

When the Promise is resolved or rejected, the callback function passed to _registerCallbacks() is executed. This function then calls the onResolved or onRejected callback function provided to the then() method, passing the resolved value or rejection reason as an argument.

If the onResolved or onRejected callback function returns a Promise object, the then() method waits for that Promise object to be resolved before resolving the new Promise object (newPromise). If the callback function returns a non-Promise value, the new Promise is resolved with that value immediately.

I hope this helps illustrate how the then() method works in JavaScript Promises!

반응형
Comments