Почему встроенная деструктуризация как аргумент функции не работает, как ожидалось

Question

Допустим, у меня есть код, который требует доступа к объекту состояния, который выглядит следующим образом

const store = {
  getState: () => ({
    a: "test",
    b: 1,
    c: 23,
  })
}

И вспомогательная функция, которая выглядит следующим образом, rest должна проиллюстрировать тот факт, что вывод этого не будет просто ПРОСТРАНСТВЕННЫМ аргументом, который я передал.

function printState ({a, b, ...rest}) {
  console.log(a, b, rest)
}

Так что, если я попытаюсь использовать встроенную деструктуризацию

printState({ a, b } = store.getState())

Выход выше

"test" 1 Object {
  c: 23
}

Я бы ожидал, что будут переданы только a и b, а не остальная часть объекта. Кто-нибудь знает, почему это так?

Answer 1

{ a, b } = store.getState() является выражением присваивания, а возвращаемое значение всегда будет выражением с правой стороны, которое равно store.getState().

Если вы хотите только a и b, тогдаВы можете использовать и IIFE.

const store = {
  getState: () => ({
    a: "test",
    b: 1,
    c: 23,
  })
}
function printState ({a, b, ...rest}) {
  console.log(a, b, rest)
}

printState((({a,b}) => ({a,b}))(store.getState()))

Answer 2

printState({ a, b } = store.getState())
           ^^^^^^^^^^^^^^^^^^^^^^^^^^^

, поскольку это выражение присваивания, которое возвращает правое значение, поэтому ваш вызов функции this на самом деле оценивается примерно так:

function printState(_ref) {
  var a = _ref.a,
      b = _ref.b,
      rest = _objectWithoutProperties(_ref, ["a", "b"]);

  console.log(a, b, rest);
}

printState((_store$getState = store.getState(),
             a = _store$getState.a,
             b = _store$getState.b, 
             _store$getState)
);

так что вы действительно получите printState(store.getState())

Вы можете вставить свой код здесь и посмотреть Бабель