JavaScript: 如何 运行 一个函数多次使用不同的参数？

Question

我使用 ExtJS 框架和一个 运行 一个方法多次使用不同的参数。

我正在寻找一种使它更加一致、简单和可维护的方法，我想只有香草 Javascript 解决方案可以解决这个问题？

我尝试将每个参数收集到数组中并使用 Array.map() 以及 forEach() 方法，但我无法处理它。

感谢提前。

//ExtJS class:
Ext.define('MyApp.FooClass', {
    extend: 'Ext.panel.Panel',

    items: [
        MyApp.createFooCard('Func1Param1', 'Func1Param2', 'Func1Param3'),
        MyApp.createFooCard('Func2Param1', 'Func2Param2', 'Func2Param3'),
        MyApp.createFooCard('Func3Param1', 'Func3Param2', 'Func3Param3'),
    ]
});

正如您所注意到的，我完全使用相同的方法，但每个方法的参数不同。

//And here is related factory-function:
createFooCard: (bindValue, userCls, glyph, label) => {
        return {
            itemId: bindValue,
            userCls: userCls,
            glyph: MyApp.getGlyph(glyph),
            items: {
                xtype: 'infocardfld',
                fieldLabel: label,
                bind: '{' + bindValue + ' || "0"}'
            }
        }
    }

Answer 1

它在工厂功能上与 Array.prototype.map to collect nested arrays and relaying those arrays with Spread syntax 到 运行 一起工作。应该是：

Ext.define('MyApp.FooClass', {
    extend: 'Ext.panel.Panel',

    items: [
              ['Func1Param1', 'Func1Param2', 'Func1Param3'],
              ['Func2Param1', 'Func2Param2', 'Func2Param3'],
              ['Func3Param1', 'Func3Param2', 'Func3Param3']
           ].map(args => MyApp.createFooCard(...args));
    });

Answer 2

如果此 Items 数组在全局范围内，您可以轻松地在 createFooCard 函数内向其添加元素。例如：

// 你的元素集合数组

var items = []

//你的函数

function createFooCard(bindValue, userCls, glyph, label) {
    var temp = {
        itemId: bindValue,
        userCls: userCls,
        glyph: MyApp.getGlyph(glyph),
        items: {
            xtype: 'infocardfld',
            fieldLabel: label,
            bind: '{' + bindValue + ' || "0"}'
        }
    };

    items.push(temp);
}

您也可以轻松地将数组作为参数传递。如果你想让它更通用。