0

This is a test case from one company. I need to translate this function into Typescript and explain how to test it. But I even don't understand what is going on here. I understand every part of that code, but a whole picture still doesn't clear for me. Could someone explain how that piece of code works step by step?

I think I need some simple analog for this. Maybe some metaphor. Also, I'm not sure how to test that to see how this function should work.

// Makes your async function sequential. It means that next call won't be performed until the previous one finishes.

// This function is a wrapper for async functions
export function sequentialize(func: (...args: any[]) => any) {
  // we create an immideately resolved promise
  // we can use that because of closure mechanism
  let previousCall: Promise<any> = Promise.resolve();

  // return wrapper that will call original function with args
  return function (...args: any[]): Promise<any> {
    // Here I'm a bit confused. I know that with then we set a callback that 
    // will work after promise will be fullfiled. But why we save this in variable
    const currentCall: Promise<any> = previousCall.then(() =>
      // call original wrapped async function with args
      func.apply(this, args)
    );
    console.log(currentCall);

    // this part is not clear for me too
    previousCall = currentCall.catch(() => {});

    return currentCall;
  };
}


// I use this code to test
const url = "https://jsonplaceholder.typicode.com/todos/1";
const myAsyncFunction = (url) => {
  return fetch(url)
    .then((response) => response.json())
    .then((json) => console.log(json));
};

const sequentializeFunc = sequentialize(myAsyncFunction);
sequentializeFunc(url);

UPDATE: add ts and some comments to parts I already understand.

Max
  • 1
  • 1
  • 4
    You need to ask specific questions, not a vague "explain all the code to me". This isn't a tutoring service. If you understand each part, what don't you understand when they're put together? – Barmar Mar 23 '21 at 20:13
  • 1
    Start by understanding what is going on in the code. You can do this by debugging it, copy paste it and run it in a browser with some test data or use stackblitz. After that try to convert it to typescript. – Igor Mar 23 '21 at 20:19
  • "*I understand every part of that code*" - could you please add explanations for these parts to your question, so that we can tell you what specific parts of the picture you're missing? Also, did you try adding types to it already? Please show us your attempt, it seems quite straightforward (although some fancy generics could help). – Bergi Mar 23 '21 at 23:43
  • "*But why we save this in variable*" - because the promise is used in multiple places. Do you understand the two usages of the `currentCall` variables? "*this part is not clear for me too: `previousCall = currentCall.catch(() => {});`*" - that's just ignoring errors, so that `previousCall` will never get rejected but only fulfilled when the previous call finishes (regardless of the result). Otherwise one could've written `previousCall = currentCall;`. – Bergi Mar 31 '21 at 11:18
  • Your current example usage has only a single `sequentializeFunc(url);` call. Consider three calls instead: `sequentializeFunc('/todos/1').then(console.log); sequentializeFunc('domain-does-not-exist.example').then(console.log); sequentializeFunc('/todos/2').then(console.log);` and try to figure out how the closure behaves – Bergi Mar 31 '21 at 11:20
  • Also have a look at [this](https://stackoverflow.com/a/18952698/1048572) or [that](https://stackoverflow.com/q/64955564/1048572). – Bergi Mar 31 '21 at 11:27

0 Answers0