Javascript 您能否动态构建方法调用链？

我遇到了一些代码，我正试图重构这些代码，他们将JavaScript作为字符串写入HTML脚本标记中，然后将其写入DOM。非常难看而且不可维护。但这允许他们做的一件事是通过附加到字符串来构建函数调用

var methods = '';
for (key in obj) {
  methods += 'func1("'+key+'", "'+obj[key]+'").';
}    
var scriptString = '<script>func2().' + methods + 'func3();</script>'

var方法=”；
用于（输入obj）{
方法+='func1（“+key+”，“+obj[key]+”）；
}    
var scriptString='func2（）.+methods+'func3（）；'

结果可能是：

'<script>func2().func1("key1", "value1").func1("key2", "value2").func3();</script>'

'func2（）.func1（“key1”，“value1”）.func1（“key2”，“value2”）.func3（）；'

---

所以，既然我真的不赞成在JavaScript中的HTML字符串中编写JavaScript。。。有人知道如何用纯JavaScript实现同样的结果吗？有没有一种方法可以通过在对象上迭代来连续地将方法追加到函数调用中？

您可以创建一个函数，对对象中的所有键/值对重复调用

func1

方法

var script = function(obj) {
    var value = func2();
    for (var key in obj) {
        value = value.func1(key, obj[key]);
    }
    value.func3();
};

Array.reduce（）

应该可以满足您的大部分需求。

棘手的部分是

.func1（）

方法调用链，其中依赖于对象的键/值对。如果您不习惯使用

Array.reduce（）

方法，我建议您通读，但它基本上是在数组中循环，对上一个结果执行转换，直到到达最后，返回最终结果。这可以用于我们的优势，因为方法链接只是对前一个方法调用的返回值的方法调用。但是，由于这是一个数组方法，我们需要先将对象的条目放入数组中……这就是

Object.entries（）

的作用

请注意，我这里的大部分语法都包含新功能，这些功能可能受目标浏览器支持，也可能不受目标浏览器支持。如果需要，请确保使用transpiler和polyfills来处理向后移动。

请参见下面的示例：

const wrapperFunc=（obj）=>{
//从func2（）开始
常量func2Result=func2（）
//obj中每个条目的链到func1（）（棘手部分）
const func1Result=Object.entries（obj.reduce）(
//对上一个结果调用func1方法以获取下一个结果
（prevResult[key，val]）=>prevResult.func1（key，val），
//上面使用的初始“prevResult”值
func2Result
)
//链到func3（）
返回func1Result.func3（）
}
//用于func1（）调用的注入对象
包装功能({
键1:‘值1’，
键2:“值2”
})

@Luca我想最后一句话正是他想要的？投票给@4castle，因为该解决方案确实有效，可能是ES5支持的一个快速便捷的技巧。我接受这个答案是因为我是ES6解决方案的粉丝，它避免了在声明变量后修改变量的需要。干得好。：）