Javascript iLife中的空数组

我试图在jsgrid中的所有行选择的标题中添加一个复选框，如图所示。它工作得很好。但是，我没有将所有代码放在一个页面中，而是尝试将这些函数放在iLife中，如下所示

var jsgridCheckBox = (function() {
    var selectedItems = [];
    var selectItem = function(item) {
        selectedItems.push(item);
        ...
    };

    var unselectItem = function(item) {
        selectedItems = $.grep(selectedItems, function(i) {
            return i !== item;
        });
        ...
    };

    var selectAllCheckBox = function(item) {
        selectedItems = [];
        if (this.checked) {
            ...
        }
    };

    return {
        selectedItems: selectedItems,
        selectItem: selectItem,
        unselectItem: unselectItem,
        selectAllCheckBox: selectAllCheckBox
    }
})();

在JSGrid中

$(function() {
    $("#jsGrid").jsGrid(
        ...
        fields: [
            itemTemplate: function(_, item) {
                return $("<input>").attr("type", "checkbox").attr("class", "singleCheckbox")
                    .prop("checked", $.inArray(item, jsgridCheckBox.selectedItems) > -1)
                    .on("change", function() {
                        $(this).is(":checked") ? jsgridCheckBox.selectItem(item) : jsgridCheckBox.unselectItem(item);
                    });
            }
            ...
        ]
    });
});

在选择复选框之后，当我尝试如下调用它时

var dialog = $("#dialog-form").dialog({
    buttons: {
        "Reject": rejectRequest,
    }
});

function rejectRequest() {
    alert(jsgridCheckBox.selectedItems.length);
    for (var i = 0; i < jsgridCheckBox.selectedItems.length; i++) {
        alert(jsgridCheckBox.selectedItems[i].some_id);
        ...
    }
    ...
}

---

它总是返回0。jsgridCheckBox是否总是返回一个新实例？如何在IIFE中维护数组的状态？

在闭包中有一个私有变量selectedItems，并且对象上还有一个名为selectedItems的属性。这会引起混乱。属性的初始值只是空数组。当选中或取消选中复选框时，selectedItems将被重新分配您的=；它不再指原始阵列。只有当所讨论的数组发生变异时，引用才会保留，这不是一个好主意

您可以定义一个getter函数，该函数返回对数组的当前引用：

var jsgridCheckBox = (function(){
  var selectedItems = [];
  var selectItem = function(item) {
    selectedItems.push(item);
  };

  var unselectItem = function(item) {
    selectedItems = $.grep(selectedItems, function(i) {
      return i !== item;
    });
  };

  var selectAllCheckBox = function(item) {
    selectedItems = [];
    if(this.checked) {
    }
  }; 

  return{
    getSelectedItems : () => selectedItems,
    selectItem : selectItem,
    unselectItem : unselectItem,
    selectAllCheckBox :selectAllCheckBox 
  }
})();

或者，您可以始终将数组作为对象的属性而不是独立变量引用：

var jsgridCheckBox = (function(){
  var selectItem = function(item) {
    this.selectedItems.push(item);

  };

  var unselectItem = function(item) {
    this.selectedItems = $.grep(this.selectedItems, function(i) {
      return i !== item;
    });

  };

  var selectAllCheckBox = function(item) {
    this.selectedItems = [];
    if(this.checked) {

    }
  }; 

  return{
    selectedItems : [],
    selectItem : selectItem,
    unselectItem : unselectItem,
    selectAllCheckBox :selectAllCheckBox 
  }
})();

---

你能把它复制到某个地方吗？实际使用它的代码在哪里？还有，如果这个。checked？@Phil编辑了我的问题，没有看到任何调用selectItem的东西，这是唯一一个将任何东西推送到selectedItems的方法。为什么你希望里面会有什么？很好地理解了引用问题，但我会保持OP的方式，但用selectedItems.length=0清空数组。函数中的这个不是绑定到函数而不是对象吗？谢谢，我会尝试一下。@Phil函数的调用上下文应该是到目前为止发布的代码中的jsgridCheckBox，对吗？但，是的，跟踪这些是很烦人的。编辑以显示另一个选项