JavaScript中的函数调用

这是我的密码

var MyNameSpace.ShoppingList = {
    addItem: function (itemName, functionName, listName) {
        $("<li>", { text: itemName })
             .on("click", functionName)
             .appendTo($("#" + listName));
    },
};

问题

我希望

警报（“单击listitem时运行我”）

仅在单击listitem时运行

我已经知道把它改成这个会有帮助

MyNameSpace.ShoppingList.addItem("Get Eggs From Market", function () { alert("Run Me when listItemClicked"); }, "shoppingpoplist");

但是上面的解决方案使我的代码非常长，所以我没有必要添加一个单独的

addListItem

，我能用最少的代码解决上面的问题吗？我是否必须添加函数（）{}。。。调用警报的位置或addListItem方法本身

如果这样做是常见的做法，那么我在这里将addItem放在单独的方法中是否正确？

语法

警报（…）

将立即调用警报，并将其返回值传递到

addItem

。相反，您需要传递一个函数，该函数在被调用时将执行

alert（..）

。这方面有三种选择：

function () { alert(..); }

或：

或：

---

你挑吧。它不会变得更短。

使用ES6，您可以获得箭头函数，从而大大缩短了时间：

MyNameSpace.ShoppingList.addItem("Get Eggs From Market",
    () => alert("Run Me when listItemClicked"), "shoppingpoplist");
//  ^^^^^ equivalent to function() { return ... }

MyNameSpace.ShoppingList.addItem（“从市场上买鸡蛋”，
handleWithAlert（“单击列表项时运行我”），“shoppingpoplist”）
handleWithAlert（）
将返回一个函数，该函数将作为第一个参数传递。因此，您得到了一个用于警报消息的通用事件处理程序生成器。
您的第二个选项，以及周围的
函数（）{…}
是一种非常标准的做法-通常称为回调。您可以将其缩短为
警报.bind（窗口，“在单击ListItem时运行我”）
，但我不确定这是否更好
alert.bind(null, '..')

function callback() {
    alert(..);
}
addItem(.., callback)

MyNameSpace.ShoppingList.addItem("Get Eggs From Market",
    () => alert("Run Me when listItemClicked"), "shoppingpoplist");
//  ^^^^^ equivalent to function() { return ... }
function handleWithAlert(msg) {
    return function() { alert(msg); };
}

MyNameSpace.ShoppingList.addItem("Get Eggs From Market", 
    handleWithAlert("Run Me when listItemClicked"), "shoppingpoplist");