有更好的方法吗?在多个函数中重用同一个循环

Is there a better way to do this? Reusing the same loop in multiple functions?

本文关键字：函数 循环 同一个 更好 方法      更新时间：2023-09-26

这3个函数分别使用相同的循环。

我应该从每个函数中删除循环并将它们放在一个大循环中吗？还有其他更好的方法吗？

    function createArrayOfNames(catsArray) {
        var catNames = [];
        for (var i = 0; i<catsArrayLength; i++) {
            catNames.push(cats[i].name);
        }
        return catNames;
    }
    //
    function createArrayOfListElements(listElement, catNames) {
        for(i = 0; i<catsArrayLength; i++) {
            var listElements = [];
            var listElement = listElement;
            listElement.innerHTML = catNames[i]
            listElements.append(listElement);
        }
        return listElements;
    }
    //Adds cat names to the catList unordered list (inside the catListContainer div)
    function addCatListToView(listElements, catNames) {
        for(i = 0; i<catsArrayLength; i++) {
            getElementById('allCats').append(listElements[i]);
        }
    }

是的，创建一个迭代函数是使代码更可读的好方法。

function iterateCats(callback) {
    for(i = 0; i<catsArrayLength; i++) {
        callback(i);
    }
}

但正如@scrimp所提到的，如果你不介意让catsArray可用于所有功能，那么使用forEach是实现这一目标的标准且更快的方法。

您可以使用Map和forEach来稍微清理代码。另外，请注意，您在每次迭代中都重置了var listElements = [];。

function createArrayOfNames(catsArray) {
    return catsArray.map(function (c) {
        return c.name
    });
}
function createArrayOfListElements(catNames) {
    var listElements = [];
    catNames.forEach(function(name) {
        var listElement = new listElement();
        listElement.innerHTML = name;
        listElements.append(listElement);
    });
    return listElements;
}
function addCatListToView(listElements) {
    var catElements = getElementById('allCats');
    listElements.forEach(function(element) {
        catElements.append(element);
    };
}
相关文章：