将动态参数传递给IIFE

Pass dynamic params to IIFE

本文关键字：IIFE 参数传递 动态      更新时间：2023-09-26

我在将变量传递给IFFE时遇到了这个问题。读了一些书，还是没弄明白。非常感谢这里的指导。

  • 我有一个点击事件处理程序函数，它从单击时使用DOM
  • 我需要把身份证交给IIFE
  • IFFE需要从数组中添加/删除该ID，取决于它是否已经存在

这就是我得到的：

事件：

$(document).on('click', 'input[type="checkbox"]', check);

点击处理程序：

function check() {
    var id = $(this).closest('ul').attr('data-id');
    return id;
}

IIFE:

var checkID = (function (val) {
    var arr = [];
    return function () {
        var i = arr.indexOf(val);
        if (i === -1) {
            arr.push(val);
        } else {
            arr.splice(i, 1);
        }
        return arr;
    }
})(id);

现在我拿到了身份证，但却找不到。

在IIFE中，我确实传递了一个id变量，但它是未定义的。

那么，我如何将ID变量im从check()传递到checkID IIFE？

其他解决方案也很受欢迎。

感谢

在您的点击处理程序中

function check() {
    var id = $(this).closest('ul').attr('data-id');
    checkID(id);
}

并将checkID更改为

var checkID = (function () {
    var arr = [];
    return function (val) {
        var i = arr.indexOf(val);
        if (i === -1) {
            arr.push(val);
        } else {
            arr.splice(i, 1);
        }
        return arr;
    }
})();

我认为你需要用另一种方式来做事情。check函数将返回事件处理程序使用的函数，但它也需要在单击处理程序运行后调用回调，从而传递数组。

check函数看起来像是两个函数的混合：

function check(callback){
  var arr = [];
  return function(){
    var id = $(this).closest('ul').attr('data-id');
    var i = arr.indexOf(id);
    if (i === -1) {
        arr.push(id);
    } else {
        arr.splice(i, 1);
    }
    callback(arr);
  }
}

正如您所看到的，它将回调函数作为参数，该函数将在每次执行时调用，并传递当前数组arr。例如，这是我的测试回调：

function handler(arr){
 alert("Array has " + arr.length + " elements");
}

最后，您的事件处理程序将如下所示：

$(document).on('click', 'input[type="checkbox"]', check(handler));

现场示例：https://jsfiddle.net/src282d6/

在IIFE函数中使用类似getter/setter的函数可以使其更有组织性和可读性。然后，使用这些函数在IIFE函数中传递、存储和读取数据。

var checkID = (function () {
    // your array
    var arr = [];
    // public
    return { 
      // get
      getArray: function(){
        return arr;
      },
      // set value
      setArray: function(val) {
        var i = arr.indexOf(val);
        if (i === -1) {
          arr.push(val);
        } else {
          arr.splice(i, 1);
        }
      }
    }
})();

按如下方式使用：

checkID.getArray(); // returns default empty array []
checkID.setArray('car1');
checkID.setArray('car2');
checkID.setArray('car3');
checkID.setArray('car4');
checkID.setArray('car4'); // test splice()
checkID.getArray(); // returns ["car1", "car2", "car3"]
相关文章：