JavaScript, return promise inside arrow function

Question

I've just seen this code:

const buildSW = () => {
  // This will return a Promise <- that comment was present on the code
  workboxBuild
    .injectManifest({
      swSrc: 'src/sw.js'
      // some code
    })
    .then(({ count, size, warnings }) => {
      // some code
    })
    .catch(console.error);
};
buildSW();

The code seems to be working, has been in production like 1 year, but I get confused with the comment of This will return a Promise because I don't see that there is actually a return statement, and the whole code is inside { }.

Shouldn't be?:

return workboxBuild
    .injectManifest({ ...etc

The code is part from this guides:

https://developers.google.com/web/tools/workbox/guides/generate-service-worker/workbox-build

where the return promise is present there. So how or why is working without return in the code showed above?

I think you're interpreting the comment as a comment about buildSW, but it looks like they're commenting on workboxBuild.injectManifest. The code usage also implies this since any return value from buildSW is ignored. — Dave Newton
– Dave Newton, Commented May 25, 2021 at 15:47
As the caller just does buildSW() without treating the return value, it wouldn't make a difference, but yes, it would make more sense if there was the return statement. — trincot
– trincot, Commented May 25, 2021 at 15:48
@pmiranda We can only guess at the original commenter's intent, both with the code, and the comment. Normally documentation comments about a function go outside the function, e.g., documentation for buildSW would be above its implementation. It doesn't look like buildSW was intended to return anything, rather to call injectManifest and do some stuff with its returned promise, and that's all. — Dave Newton
– Dave Newton, Commented May 25, 2021 at 15:52
The code is present in many guides around WITH return, I put a link of the original example, here's another one: lifesaver.codes/answer/guidlines-for-using-workbox and another from CRA of Facebook (they created the example) github.com/facebook/create-react-app/issues/5673 — pmiranda
– pmiranda, Commented May 25, 2021 at 15:54

jib · Accepted Answer · 2021-05-29 23:48:34Z

2

The comment is commenting on the line following it, and is redundant. E.g.

// a() will return a Promise
a().then(() => () // duh

...because it's equivalent to:

const promise = a();
promise.then(() => ()

Shouldn't be?: return workboxBuild.injectManifest({ ...etc

It depends on the contract you want buildSW to have.

As written, buildSW returns nothing and handles its own errors, using .catch(console.error) to emit them to console. Appropriate for event handlers — E.g. button.onclick = buildSW.

But if you expect to call buildSW from other places, a better contract is to return a promise, and leave error handling to the caller:

const buildSW = () => {
  return workboxBuild.injectManifest({swSrc: 'src/sw.js'})
    .then(({ count, size, warnings }) => {
      // some code that may also fail
    });
};
buildSW().catch(console.error);

answered May 29, 2021 at 23:48

jib

42.8k17 gold badges111 silver badges166 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Bergi Over a year ago

"The comment is commenting on the line following it" - I disagree. In the google guide where it was copy-pasted from it certainly refers to both the injectManifest as well as the buildSW method.

jib Over a year ago

@Bergi well there it made sense (because the next line began with return) whereas here it does not. But sure, copy-paste-mistake is another possible answer.

Bergi · Accepted Answer · 2021-05-30 01:02:33Z

0

I get confused with the comment because I don't see that there is actually a return statement, like it is present in the guide. Shouldn't it have one?

Yes, there should be a return statement. Sure, the function already catches errors and logs them, but it's still a good idea to always return a promise from asynchronous functions.

So how or why is working without return in the code showed above?

It's working only because the buildSW(); call you're doing doesn't try to use the promise that should be returned.

answered May 30, 2021 at 1:02

Bergi

671k162 gold badges1k silver badges1.5k bronze badges

Collectives™ on Stack Overflow

JavaScript, return promise inside arrow function

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related