删除方法中的冗余代码

Question

我使用以下代码，这很有效，但在阅读了JS之后（我很新），我注意到了3件事。

1. 在方法开始时使用返回

2. 使用ternary条件（不确定在这种情况下如何使用）

3. 使用reduce（对此不确定，但可能不是forEach）

可以在下面的代码中使用它吗？

 get: function(document, oData) {
        var self = this;
        var oInnerHTML;
        if (oData) {
            var oParsedHTML = this._parseHtml(document);
            oInnerHTML = oParsedHTML;
            oData.forEach(function(configEntry) {
                oInnerHTML = self._routeExtentionTypes(configEntry, oInnerHTML);
            });
            oInnerHTML = this._convertBackToHtml(oInnerHTML);
        } else {
            oInnerHTML = document;
        }
         return oInnerHTML
    }

代码所做的是

1. 获取HtmlString并对其进行解析
2. 根据cofigEntry和原始HTML对其进行扩展
3. 配置条目完成后，它会转换回HTML

Answer 1

在方法的开头使用return

当您的对象准备好具有所需值时，请使用return。尽早返回是很好的做法。这样，执行和评估的代码数量最少。

在上面的示例"oInerHTML"中，变量在满足基于值的特定条件的情况下做好准备，因此在这种情况下，只要对象/变量准备好了值，就可以返回它。

使用三元条件

当你根据一个简单的条件为变量赋值，或者你做出多个结果非常简短的决策时，三元运算符很常见。例如

x ? y: z

在上面的例子中，三元运算符可以如下使用：（请执行代码并仔细检查）

get: function(document, oData) {
  var self = this;      
  return (oData) ? document : get_oInnerHTML(oData);
}      
function get_oInnerHTML (oData){
  var oInnerHTML;
  oData.forEach(function(configEntry) { oInnerHTML = self._routeExtentionTypes(configEntry, this._parseHtml(document)); });
  return oInnerHTML;
}  

上面的代码在三元条件下使用了一个函数。由于有许多行需要在条件中执行，所以我为它创建了单独的函数并在条件中使用。

使用reduce

reduce（）方法对累加器和数组的每个值（从左到右）应用一个函数，将其减少为一个值。

[0, 1, 2, 3, 4].reduce(function(previousValue, currentValue, currentIndex, array) { return previousValue + currentValue; });

Answer 2

我认为，您可以在Array#reduce()中尝试。

基本上，减少就是做你想做的事。它取一个起始值，根据需要迭代一个数组并返回一些值。

前一个代码

var oParsedHTML = this._parseHtml(document);
    oInnerHTML = oParsedHTML;
oData.forEach(function(configEntry) {
    oInnerHTML = self._routeExtentionTypes(configEntry, oInnerHTML);
});

转换为

this._convertBackToHtml(oData.reduce(function (r, configEntry) {
    return self._routeExtentionTypes(configEntry, r);
}, this._parseHtml(document))) :

因为开始值现在是CCD_ 4而不需要额外的变量，并且返回值成为下一次迭代的新输入值。

get: function (document, oData) {
    var self = this;
    return oData ?
        this._convertBackToHtml(oData.reduce(function (r, configEntry) {
            return self._routeExtentionTypes(configEntry, r);
        }, this._parseHtml(document))) :
        document;
}