Question

我有几件事情我试图用forEach替换（因为这是我正在上课的要求）但是其中没有一个有效：

我的原始For for code（这可以正常工作并显示内容）：

for (var i in education.schools) {
        $('#education').append(HTMLschoolStart);

        var formattedName = HTMLschoolName.replace('%data%', education.schools[i].name).replace('#', education.schools[i].url);
        var formattedLocation = HTMLschoolLocation.replace('%data%', education.schools[i].location);
        var formattedDegree = HTMLschoolDegree.replace('%data%', education.schools[i].degree);
        var formattedMajors = HTMLschoolMajor.replace('%data%', education.schools[i].majors);
        var formattedDates = HTMLschoolDates.replace('%data%', education.schools[i].dates);
        var formattedNameDegree = formattedName + formattedDegree;


        $('.education-entry:last').append(formattedNameDegree);
        $('.education-entry:last').append(formattedDates);
        $('.education-entry:last').append(formattedLocation);
        $('.education-entry:last').append(formattedMajors);
    }

我的forEach变体（没有显示任何内容，所有内容都消失了）：

education.schools.forEach(function() {
        $('#education').append(HTMLschoolStart);

        var formattedName = HTMLschoolName.replace('%data%', education.schools[i].name).replace('#', education.schools[i].url);
        var formattedLocation = HTMLschoolLocation.replace('%data%', education.schools[i].location);
        var formattedDegree = HTMLschoolDegree.replace('%data%', education.schools[i].degree);
        var formattedMajors = HTMLschoolMajor.replace('%data%', education.schools[i].majors);
        var formattedDates = HTMLschoolDates.replace('%data%', education.schools[i].dates);
        var formattedNameDegree = formattedName + formattedDegree;


        $('.education-entry:last').append(formattedNameDegree);
        $('.education-entry:last').append(formattedDates);
        $('.education-entry:last').append(formattedLocation);
        $('.education-entry:last').append(formattedMajors);
    })

第二个是if语句，我应该用forEach替换部分。

if语句工作得很好，只有这个问题是它只适用于7个项目，如果我再添加到数组中，我还必须更新它：

if (bio.skills.length > 0) {
        $('#header').append(HTMLskillsStart);

        var formattedSkill = HTMLskills.replace('%data%', bio.skills[0]);
        $('#skills').append(formattedSkill);
        var formattedSkill = HTMLskills.replace('%data%', bio.skills[1]);
        $('#skills').append(formattedSkill);
        var formattedSkill = HTMLskills.replace('%data%', bio.skills[2]);
        $('#skills').append(formattedSkill);
        var formattedSkill = HTMLskills.replace('%data%', bio.skills[3]);
        $('#skills').append(formattedSkill);
        var formattedSkill = HTMLskills.replace('%data%', bio.skills[4]);
        $('#skills').append(formattedSkill);
        var formattedSkill = HTMLskills.replace('%data%', bio.skills[5]);
        $('#skills').append(formattedSkill);
        var formattedSkill = HTMLskills.replace('%data%', bio.skills[6]);
        $('#skills').append(formattedSkill);
    }

forEach循环代码（不是显示数组中的每个项目，而是显示数组中的所有项目七次，基本上它似乎迭代了正确的次数但是每次迭代输出所有7个项目）： / p>

if (bio.skills.length > 0) {
        $('#header').append(HTMLskillsStart);

        bio.skills.forEach(function(){
            var formattedSkill = HTMLskills.replace('%data%', bio.skills);
            $('#skills').append(formattedSkill);
        })
    }

Answer 1

尝试在forEach回调函数中声明索引：

education.schools.forEach(function(val, i) {
    $('#education').append(HTMLschoolStart);

    var formattedName = HTMLschoolName.replace('%data%', education.schools[i].name).replace('#', education.schools[i].url);
    var formattedLocation = HTMLschoolLocation.replace('%data%', education.schools[i].location);
    var formattedDegree = HTMLschoolDegree.replace('%data%', education.schools[i].degree);
    var formattedMajors = HTMLschoolMajor.replace('%data%', education.schools[i].majors);
    var formattedDates = HTMLschoolDates.replace('%data%', education.schools[i].dates);
    var formattedNameDegree = formattedName + formattedDegree;


    $('.education-entry:last').append(formattedNameDegree);
    $('.education-entry:last').append(formattedDates);
    $('.education-entry:last').append(formattedLocation);
    $('.education-entry:last').append(formattedMajors);
});

每Mozilla：

使用三个参数调用回调：



元素值



元素索引



正在遍历的数组

修改：

在评论中提及Andreas，如果forEach正在运行education.schools数组，那么您可以在回调中使用第一个参数（val）而不是education.schools[i]来获取当前项目。

Answer 2

每次回调都会传递三个参数：

currentValue - 数组中的当前元素
索引 - ucrrent值的索引
数组 - 数组本身

因此，您应该使用currentValue.url代替education.schools[i].name。

education.schools.forEach(function(currentValue) {
    $('#education').append(HTMLschoolStart);

    var formattedName = HTMLschoolName.replace('%data%', currentValue.name).replace('#', currentValue.url);
    var formattedLocation = HTMLschoolLocation.replace('%data%', currentValue.location);
    var formattedDegree = HTMLschoolDegree.replace('%data%', currentValue.degree);
    var formattedMajors = HTMLschoolMajor.replace('%data%', currentValue.majors);
    var formattedDates = HTMLschoolDates.replace('%data%', currentValue.dates);
    var formattedNameDegree = formattedName + formattedDegree;


    $('.education-entry:last').append(formattedNameDegree);
    $('.education-entry:last').append(formattedDates);
    $('.education-entry:last').append(formattedLocation);
    $('.education-entry:last').append(formattedMajors);
})

Answer 3

forEach中的问题是您没有定义i。要解决这个问题，您应该替换现有变量的i，或者定义i。

您的代码可能是这样的：

education.schools.forEach(function() {
    $('#education').append(HTMLschoolStart);

    var formattedName = HTMLschoolName.replace('%data%', this.name).replace('#', this.url);
    var formattedLocation = HTMLschoolLocation.replace('%data%', this.location);
    var formattedDegree = HTMLschoolDegree.replace('%data%', this.degree);
    var formattedMajors = HTMLschoolMajor.replace('%data%', this.majors);
    var formattedDates = HTMLschoolDates.replace('%data%', this.dates);
    var formattedNameDegree = formattedName + formattedDegree;


    $('.education-entry:last').append(formattedNameDegree);
    $('.education-entry:last').append(formattedDates);
    $('.education-entry:last').append(formattedLocation);
    $('.education-entry:last').append(formattedMajors);
})

请注意，主要更改是使用this代替education.schools[i]。

forEach vs. in in

3 个答案: