Why is it possible to reassign `const x` in the console after an await?

Question

EDIT: I discovered you don't even need the function. This works too for me:

const x = await 'hello'
x = 'something else'

Note that without the await it throws an error.

By first defining an async function,

async function a() {
  return new Promise(resolve => {
    resolve('hello')
  })
}

Then assigning x to 'hello' ,

const x = await a()

Then reassigning x .

x = 'something else'

If x is a constant variable, why can it be reassigned? Is there something obvious I'm missing here?

Here's the complete code (tested in browser console on Chrome 80.0.3987.87):

async function a() {
  return new Promise(resolve => {
    resolve('hello')
  })
}

const x = await a()

x = 'something else'

Answer 1

I am unable to reproduce what you describe. It throws an error for me.

 async function a() { return new Promise(resolve => { resolve('hello') }) } (async () => { try { const x = await a(); x = 'something else'; console.log("worked", x); } catch (err) { console.log("didn't work", err.toString()); } })()

With your updated question, i see that this occurs when you enter the code in the chrome developer console. Futhermore, your code is using await outside an async function. Top-level await is not yet a part of the javascript standard, though it is working its way through the approval process . The dev tools do let you do it, but i would not be surprised if the behavior that results is nonstandard.

Answer 2

Update: I'm able to reproduce the error in: Firefox 72.0.2 (64-bit), However if you wrap it within an async function it doesn't behave like that..

To know more about: ECMAScript proposal: Top-level await

You can await strings because it's permitted: block-await-expr-literal-string.js , AwaitExpression StringLiteral (Valid syntax for top level await in a block.) Thus const x = await ''; is valid syntax

(async () => {
    async function a() {
        return new Promise(resolve => {
            resolve('hello')
        })
    }

    const x = await a()

    x = 'something else'

})();

Hmm, probably you're missing the console debugger..

async function a() {
  return new Promise(resolve => {
    resolve('hello')
  })
}

const x = await a()

x = 'something else'
x = 'not assignable... in console or whatever..';

Answer 3

You shouldn't be using await keyword in sync function (your func here is the global scope). It doesn't make sense. We are using await to wait for some async operation for ex. API call.

If you remove await it will normally throw an error.

Answer 4

First of all please don't use browser console as an ideal editor environment when you are learning these things.

Secondly I just checked what you mentioned in the browser console.

If you simply copy and past your whole code once it gives an error as expected saying constants can't be reassigned. as clearly mentioned in the @some user's answer.

But if you copy and past it line by line it won't give you any errors.

I'm not exactly sure what is the reason but you can't expect browser console to provide you with 100% compiler/validation environment.

So unless it is some simple expression evaluation it is best to use a good development environment so you won't get confused by unexpected behaviors.

If you still need something that runs on the browser try this http://www.typescriptlang.org/play/

EDIT: I found this comment on @Nicholas Tower's answer and it seems like the correct answer to this question

"The top-level-await proposal is for modules only, it won't have any effect on await in the devtools console. – Bergi"

Happy coding!!!