JavaScript 条件逻辑生成对象，初学者卡在流程中

问：

目标：创建一个条件语句，该语句在系统的预定义布局中生成数据。

示例：如果选择了 New Item，则它应包含其“ID”并将“Enable”设置为 true。

{
  "draw": 1,
  "length": 1,
  "server": "argp",
  "data": [
    {
      "id": 4343,
      "enable": true
    }

  ]
}

示例：如果选择了两个新项目，并取消了一个现有项目，则数据应如下所示：

{
  "draw": 1,
  "length": 3,
  "server": "argp",
  "data": [
    {
      "id": 4343,
      "enable": true
    },
    {
      "id": 5555,
      "enable": true
    },
    {
      "id": 6666,
      "enable": false
    }
  ]
}

我写了一个条件语句，用“enable： true”列出了所有选定的“id”。

• 图 1（假设最初选择了两个项目）： 图 1

• 图2（选择第三项后，也列出）：图2

下面是带有条件语句的代码，尚未达到预期的效果：

<script>
  var old_data = []; // Define a variable to store previously selected data

  function modalTable() {
    console.log("TABLE MODAL");
    const getToken = localStorage.getItem("token");
    var new_edit_data = {
      draw: 1,
      length: 0,
      server: "argp",
      data: []
    };

    var tablefor4 = $("#example_04").DataTable({
      ajax: {
        url: "http://192.168.03.30:6000/api/message/all", // Fake API
        headers: {
          'Authorization': 'Bearer ' + getToken
        },
        dataSrc: function (response) {
          console.log("DATA MODAL TABLE", response.data);
          return response.data;
        },
      },
      destroy: true,
      columns: [
        { data: "sf", title: "sf" },
        { data: "code", title: "code" },
        { data: "subcode", title: "subcode" },
        { data: "msgtext", title: "msgtext" }, 
        { data: "description", title: "description" },    
        {
          data: null,
          title: "Alarm/Event Setting",
          render: function (data, type, row) {
            var switchId = 'customSwitch_' + row.id; // Assuming you have an 'id' field in your data
            var switchHTML = '<div class="custom-control custom-switch">';
            var isChecked = row.argp ? 'checked' : ''; // Check if rowData.argp is true and add the checked attribute if so
            switchHTML += '<input type="checkbox" class="custom-control-input" id="' + switchId + '" ' + isChecked + '>';
            switchHTML += '<label class="custom-control-label" for="' + switchId + '">Selected</label>';
            switchHTML += '</div>';
            return switchHTML;
          },
          createdCell: function (td, cellData, rowData, row, col) {
          var switchId = 'customSwitch_' + rowData.id; // Assuming you have an 'id' field in your data
          var switchElement = $(td).find('#' + switchId);
          var previousArgpValue = rowData.argp; // Store the previous argp value
          switchElement.change(function () {
            if ($(this).is(':checked')) {
              rowData.argp = true;
            } else {
              rowData.argp = false;
            }
            var selectedRows = tablefor4.rows({ selected: true }).data();
            var newSelectedData = selectedRows.filter(function(row) {
              return row.argp === true && !old_data.some(function(prevRow) {
                return prevRow.id === row.id;
              });
            }).map(function(row) {
              return { id: row.id, enable: true };
            });
            old_data = selectedRows.toArray(); // Update previously selected data
            new_edit_data.data = new_edit_data.data.concat(newSelectedData); // Combine newly selected data
            new_edit_data.length = new_edit_data.data.filter(function(row) {
              return row.enable === true;
            }).length;

            // If previously selected data was modified in the new selection, revert the argp value
            if (!old_data.some(function(prevRow) {
              return prevRow.id === rowData.id && prevRow.enable === previousArgpValue;
            })) {
              rowData.argp = previousArgpValue;
            }

            console.log("Selected Rows (new):", new_edit_data);
            console.log("old_data:", old_data);
          });
        }


        },
      ]
    });

    tablefor4.draw();
  }
</script>

当前输出将如下所示，列出所有选定的“id”和“enable： true”（包括旧的和新选择的，但不包括新取消选择的）：

我希望它能计算出“长度”和新修改的“id”中的修改次数及其相应的“启用”状态。

例如：

假设我们选择两个新项目并取消选择一个旧项目，结果应如下所示：

{
  "draw": 1,
  "length": 3,
  "server": "argp",
  "data": [
    {
      "id": 4343,
      "enable": true
    },
    {
      "id": 5555,
      "enable": true
    },
    {
      "id": 6666,
      "enable": false
    }
  ]
}

For writing wizards, it might be quick, but I'm stuck on this and a bit puzzled. Any guidance would be greatly appreciated!