JavaScript Promises: Failure to understand when Resolve is in scope

Question

I've been trying different ways of resolving a Promise with inconsistent results. I've included two code snippets, and I'm unsure of what is happening differently so that the first resolves successfully while the second fails.

In this first attempt, I include an IIFE in the Promise, and the IIFE recognizes resolve despite the fact that I didn't pass this into the function itself. The result is "test" being successfully logged to the console:

const testFunction = function() {
  return new Promise(function(resolve) {
  !function() {
    resolve();
  }();
  });
};

!async function() {
  await testFunction();
  console.log('test');
}();

In the next example, I created a separate function which is called within the Promise. However, this other function doesn't seem to know what resolve is unless I define the function to take a parameter and then pass resolve through later on. This version below does not work:

const printSomething = () => {
  resolve();
  }

const testFunction = function() {
  return new Promise(function(resolve) {
    printSomething();
  });
};

!async function() {
  await testFunction();
  console.log('test');
}();

I expected that since printSomething is running within testFunction, just as the IIFE was, that resolve would be available. Any explanation to clear this up would be helpful. Apologies in advance if this is actually a failure of understanding scope in general and not specific to Promises.

_"the IIFE recognizes `resolve` despite the fact that I didn't pass this into the function itself"_ it's in scope as the function argument for the `Promise` callback — Phil, May 21 '20 at 05:41
Thanks Phil. Simple explanation, but I was looking at this all wrong. — UnderwaterHandshake, May 21 '20 at 05:50

jfriend00 · Accepted Answer · 2020-05-21T05:50:38.713

resolve is just a normal javascript variable. It's in or out of lexical scope just like any other javascript variable. So, when you're using it like this:

function someFunc() {
    return new Promise(resolve => {
        let greeting = "hello";
        // resolve is in scope inside here, but nowhere else
        callSomething();
    });
}

function callSomething() {
   // resolve is not in scope here
}

It's only in scope inside the promise executor function. If you want it in scope somewhere else, you would have to pass it to the other functions, just like you would any other local Javascript variable.

It works inside your IIFE because that's inside the promise executor function so therefore, resolve is found in a parent scope. Remember that in Javascript scope is from the lexical definition, not from the stack or call chain.

It does not work inside your printSomething() function because that's not in the same lexical scope.

As another example, resolve will be in scope the same places that the greeting variable is in scope. It behaves just the same. It's private to it's own scope and any child scopes.

Thanks jfriend00. I realize now I had two issues: 1) I was thinking `resolve` was somehow more transcendent in JS than it is, and 2) my assumption that `printSomething` was also running "in" my executor function was not correct, as it is defined elsewhere. — UnderwaterHandshake, May 21 '20 at 05:52

JavaScript Promises: Failure to understand when Resolve is in scope

1 Answers1