将键值对推送到 Javascript 中的对象

Question

当检查或未选中，我有七个复选框，我想将当前选中的框推送到checkedCheckboxes对象中。 当我console.log if语句中的键/值对时，我得到了正确的输出，但是，当我在分配更新的值后console.log() checkedCheckboxes ，我得到了这个（日志底部的对象） ：

所以我认为这行肯定有问题： checkedCheckboxes = {...key, ...colourCheckbox[key]}; .

如果有人能告诉我什么，那将是一个巨大的帮助。

完整代码：

  // store checkbox values in an object;
  const colourCheckbox = {
    whiteBox: $('#white'),
    blueBox: $('#blue'),
    blackBox: $('#black'),
    redBox: $('#red'),
    greenBox: $('#green'),
    colourlessBox: $('#colourless'),
    multicolouredBox: $('#multicoloured')
  };

  // initialise object to store which checkboxes are checked
  let checkedCheckboxes = {};

  // store checked boxes in 'checkedBoxes'
  $('.colour-checkbox').change(() => {
    checkedCheckboxes.length = 0;
    for (const key in colourCheckbox) {
      if ($(colourCheckbox[key]).is(':checked')) {
        checkedCheckboxes = {...key, ...colourCheckbox[key]};
        console.log(key, colourCheckbox[key])
      }
    }
    console.log(checkedCheckboxes)
  });

Answer 1

如果您这样做，则不需要使用扩展运算符。 尝试将您的代码更改为此

// store checkbox values in an object;
      const colourCheckbox = {
        whiteBox: $('#white'),
        blueBox: $('#blue'),
        blackBox: $('#black'),
        redBox: $('#red'),
        greenBox: $('#green'),
        colourlessBox: $('#colourless'),
        multicolouredBox: $('#multicoloured')
      };

      // initialise object to store which checkboxes are checked
      let checkedCheckboxes = {};

      // store checked boxes in 'checkedBoxes'
      $('.colour-checkbox').change(() => {
        checkedCheckboxes.length = 0;
        for (const key in colourCheckbox) {
          if ($(colourCheckbox[key]).is(':checked')) {
            checkedCheckboxes[key] = colourCheckbox[key];
            console.log(key, colourCheckbox[key])
          }
        }
        console.log(checkedCheckboxes)
      });