需要一段JS代码来多次使用不同的值和函数名称。如何高效地做到这一点？

我有一个像这样的脚本：

<div id="foo"></div>
<script>
var foo;
bar()
function bar() {
    var config = {
        a: "foo",
        b: "string",
        otherConfig1: ...
        otherConfig2: ...
        ...
    }
    
    foo = new NeoVis.default(config)
    foo.render();
    console.log(foo);
}
</script>

我还想要 8 块，不同的foo, bar and string. The otherConfigs 不变。我可以简单地复制它们，但由于otherConfigs 很长，我想做得更聪明。我读过关于构造函数 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/constructor，但由于该函数没有任何参数，我不知道如何应用它。我也尝试移动config函数外部的对象，但代码似乎无法运行。

_{Neovis https://github.com/neo4j-contrib/neovis.js is a library. I also ask this on Neovis's Github: How to have multiple divs with different initial Cypher query? https://github.com/neo4j-contrib/neovis.js/issues/233}

您可以实现一个函数，将其传递给id, func, string作为参数来生成function进入context你更喜欢（可能window）。我已经实现了一个虚拟NeoVis为了进行测试，您需要使用您的。

var NeoVis = {
    default: function(config) {
        this.render = function() {};
    }
};

function myfunction(context, id, func, str) {
    context[id] = undefined;
    return context[func] = function() {
        var config = {
            a: id,
            b: str,
            //otherConfigs...
        };
        
        context[id] = new NeoVis.default(config);
        context[id].render();
        console.log(`function ${func} was called and ${id} is the id`);
    };
}

for (let item of document.querySelectorAll("#foo, #lorem, #dolor")) {
    myfunction(window, item.id, item.getAttribute("data-function"), item.innerText)();
}

<div id="foo" data-function="bar">string1</div>
<div id="lorem" data-function="ipsum">string2</div>
<div id="dolor" data-function="es">string3</div>