Как правильно использовать разрушающий объект в этой ситуации?

Question

Я недавно добавил ESLint в проект, чтобы улучшить проект и свои навыки.

const server = app.listen(config.port, () => {
    const host = server.address().address;
    const port = server.address().port;
    log.info(`API server listening on host ${host}, port ${port}`);
});

ESLint говорит использовать деструктуризацию для строк 2 и 3.

«Быстрое исправление», которое мне дает VSCode,

const server = app.listen(config.port, () => {
    const { host } = server.address();
    const { port } = server.address();
    log.info(`API server listening on host ${host}, port ${port}`);
});

Это кажется ... как-то не так.
Если быстрое исправление на самом деле не является правильным, может кто-нибудь научить правильному способу использования деструктуризации здесь.
Если это действительно правильное решение, может кто-нибудь объяснить причины этого лучше, чем было раньше.

Я не хочу слепо следовать ESLint, но я не собираюсь игнорировать совет такого инструмента, как ESLint. Как я уже сказал, я хочу учиться.

Answer 1

Вы можете уничтожить значение, одновременно сопоставляя поля с разными именами.

const mockServer = {
  address() {
    return {
      address: 'foo',
      port: 3000,
    };
  },
};

const { address: host, port } = mockServer.address();

console.log(host, port);

Answer 2

Разрушение javascript работает следующим образом: см. Пример ниже: Допустим, вы определяете объект x, имеющий ключи a, b, c:

var x = {a:1, b:2, c:3};

Теперь, если вы хотите получить только ключи a и c от объекта x и сохранить их в переменной, а также если вы хотите назначить ключ a для именованной переменной с произвольным именем, допустим, что это m :

var {a:m, c} = x;

console.log(a); // throws error "Uncaught ReferenceError: "a" is not defined"

console.log(m); // prints 1 здесь значение «а» присваивается переменной m

console.log(c); // prints 3 здесь значение "c" присваивается именованной переменной по умолчанию "c"

Надеюсь, это объясняет вам работу деструктуризации в javascript. Ниже приведена реализация деструктуризации в вашем вопросе:

const server = app.listen(config.port, () => {
    const { address: host, port } = server.address();
    log.info(`API server listening on host ${host}, port ${port}`);
});