Почему не выполняется деструктурирующие присваивание без условия?

Question

[amiznikov]

Всем привет, вопрос скорее просто на рассуждение и понимание жс.
Есть такой код:

async function requestKeyParsingToken() {
  try {
    const { data } = await request({
      method: "get",
      url: TOKEN_SETTINGS,
    })    

    ({public_key: keyParsingTokenEndpoint} = data);    
  } catch (error) {
    console.log(error)
  }
}

request - под капотом этой функции обычный axios запрос
Как я написал выше код не работает, но если я поставлю условие

if(data) {
    ({public_key: keyParsingTokenEndpoint} = data);    
  }

то все будет работать.
почему так я не совсем понимаю.
у меня только такой вариант: js думает, что в data будет пусто и заранее выдает ошибку

Comments

[Антон Антон]

Ошибку мы должны угадать?

[Lynn «Кофеман»]

Я угадаю. Нужна точка с запятой после request.

ASI бессердечная сволочь

[Антон Антон]

Lynn «Кофеман», действительно. Чтобы интерпретатор конец выражения определил правильно.
но не очевидно.

spoiler

походу, он думает, что это может быть функция, возвращающая функцию и вот внутри - это параметр этой второй функции с дефолтным значением

[WbICHA]

Антон Антон, он ничего не думает. Круглые скобки после круглых скобок без разделителя (точка с запятой) означает вызов функции. Так же как и:

fn()
`something`
// =
fn()`something`

[Антон Антон]

WbICHA, ну, вместо точки с запятой можно вставить const a = 1 (или просто a = 1) , можно обернуть то, что ниже в {} , можно добваить там let и т.п.
т.е. дело именно в том, что он определяет дальнейшее присваивание как продолжение первого выражения

[WbICHA]

Антон Антон,

вместо точки с запятой можно вставить const a = 1 (или просто a = 1)

Нельзя, ты просто перенесёшь ошибку чуть ниже.

т.е. дело именно в том, что он определяет дальнейшее присваивание как продолжение первого выражения

Нет, он определяет круглые скобки как круглые скобки, а это вызов функции, если перед ними нет точки с запятой или иного символа, который нельзя посчитать как функцию.

Answer 1

[Дмитрий Беляев]

В таком виде, JS воспринимает всю конструкцию как единое выражение, оператор if же способствует автоматической расстановке точек с запятой.
В итоге получается такая последовательность действий:

async function requestKeyParsingToken() {
  try {
    ({public_key: keyParsingTokenEndpoint} = data);
    const {data} = await request({
      method: "get",
      url: TOKEN_SETTINGS,
    })(data);     
  } catch (error) {
    console.log(error)
  }
}

А ошибка возникает из-за использования переменной до ее объявления, что запрещено с переменными объявленными через let и const, это называется "мертвое всплытие".

P.S. таких ошибок (а так же многих других) помогает избегать eslint, конкретно в данном случае помогло бы правило semi с параметром always

Answer 2

[profesor08]

const { data } = await request({
      method: "get",
      url: TOKEN_SETTINGS,
    }); // точку с запятой сюда иначе следующие скобки () отработают как вызов функции. Как код отрабатывает справа на лево.

const {public_key: keyParsingTokenEndpoint} = data;