I've tried mixing Promises with ES6 destructuring syntax (just for experimentation purposes) but the following code throws an error:

function delay(ms) {
  return new Promise((resolve, reject) => {
    setTimeout(() => resolve(), ms)
  })
}

const { then } = delay(2000)

console.log(typeof then) // ==> 'function'

// throws TypeError:
then(() => {
  console.log(`done!`)
})

On Node.js v7.10.1 it prints:

TypeError: Cannot read property 'Symbol(promise_state_symbol)' of undefined

Chrome console also throws a TypeError, but with a different message:

Uncaught TypeError: Method Promise.prototype.then called on inpatible receiver undefined

These errors don't say much to me. What's better explanation for this?

I've tried mixing Promises with ES6 destructuring syntax (just for experimentation purposes) but the following code throws an error:

function delay(ms) {
  return new Promise((resolve, reject) => {
    setTimeout(() => resolve(), ms)
  })
}

const { then } = delay(2000)

console.log(typeof then) // ==> 'function'

// throws TypeError:
then(() => {
  console.log(`done!`)
})

On Node.js v7.10.1 it prints:

TypeError: Cannot read property 'Symbol(promise_state_symbol)' of undefined

Chrome console also throws a TypeError, but with a different message:

Uncaught TypeError: Method Promise.prototype.then called on inpatible receiver undefined

These errors don't say much to me. What's better explanation for this?

• javascript
• node.js
• ecmascript-6
• promise

Share Improve this question Follow asked Nov 25, 2017 at 14:44 Ruan MartinelliRuan Martinelli 36433 silver badges1010 bronze badges 2

• When you pull .then() out of the Promise object, the subsequent function call won't have the correct this value. – Pointy Commented Nov 25, 2017 at 14:46
• What's the use case of this? – evolutionxbox Commented Nov 25, 2017 at 14:57

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

It means that then is a method and you did not call it on any instance - you just called it as a function without any this context (or "receiver", as the second error message names it properly). You essentially did

const then = Promise.prototype.then
console.log(typeof then) // ==> 'function'
then(() => {}) // throws TypeError

You could use call

const promise = delay(2000);
then.call(promise, console.log);

or just properly invoke promise.then(console.log).

You are Assigning the then method to a variable, but then accesses this. You could use bind to achieve what you want.

Basically methods in javascript are just functions that are using this. If you are “stealing” the function and don't supply a this value, you are in dangerous territory.

Also the then you're extracting is most likely from Promise.prototype, not a function specific to the delay function.

You just found a fancy way to get the method from the object. It has not much to do with destucturing at all…

let p;
const {then} = p = delay(2000);
const then1 = p.then;

console.assert(then === Promise.prototype.then)
console.assert(then1 === then, 'thens aren\'t the same')

But you want a then, that somehow ensures, that you call it on the right promise.

So you could either go with

const p = delay(2000);
const then = p.then.bind(p);
…

Or construct another anonymous function

const p = delay(2000);
const then = fn => p.then(fn)

Note that this is not what you want, because it start the timeout when you are calling your then.

const then = fn => delay(2000).then(fn) // ⚠ setTimeout gets called when you are calling then.

I see no way how you would achieve what you want in one line, but maybe others have an idea.