Using switch inside for loop not working as expected

var userChosenBadges - ['Next.js', 'React']


function generateFrameworkBadges(userChosenBadges) {

    var badgeUrlArray = [];

    for (let i = 0; i < userChosenBadges.length; i++) {
        switch (userChosenBadges[i]) {
            case 'Next.js':
                badgeUrlArray.push('url1')
                break;
            case 'React':
                badgeUrlArray.push('url2')
                break;
            case 'Vue':
                badgeUrlArray.push('url3')
                break;
            case 'Angular':
                badgeUrlArray.push('url4')
                break;
            case 'Svelte':
                badgeUrlArray.push('url5')
                break;
            case 'Laravel':
                badgeUrlArray.push('url6')
                break;
            case 'Bootstrap':
                badgeUrlArray.push('url7')
                break;
            case 'jQuery':
                badgeUrlArray.push('url8')
                break;
        }
    }

    console.log(badgeUrlArray);
    console.log(userChosenBadges);
    if (badgeUrlArray) {
        for (let i = 0; i < badgeUrlArray.length; i++) {
            console.log(`![${userChosenBadges[i]}](${badgeUrlArray[i]})`)
            return `![${userChosenBadges[i]}](${badgeUrlArray[i]})`;
        }
    }

}


generateFrameworkBadges(userChosenBadges)

I expected two badges to be returned in markdown format:

![ Next.js ]( url1 ) ![ Vue ]( url3 )

However, I only get:
![ Next.js ]( url1 )

The intended logic is that the for loop will execute a switch statement to return the relevant link for each item in the array. However, it appears only to do so for the first array item.

>Solution :

Don’t return inside the loop, as that will only return the first element. Either build up a result array to return after the loop, or use Array#map.

var userChosenBadges = ['Next.js', 'React']
function generateFrameworkBadges(userChosenBadges) {
    var badgeUrlArray = [];
    for(let i=0;i<userChosenBadges.length;i++)switch(userChosenBadges[i]){case"Next.js":badgeUrlArray.push("url1");break;case"React":badgeUrlArray.push("url2");break;case"Vue":badgeUrlArray.push("url3");break;case"Angular":badgeUrlArray.push("url4");break;case"Svelte":badgeUrlArray.push("url5");break;case"Laravel":badgeUrlArray.push("url6");break;case"Bootstrap":badgeUrlArray.push("url7");break;case"jQuery":badgeUrlArray.push("url8")}
    return userChosenBadges.map((badge, i) => `![${badge}](${badgeUrlArray[i]})`);
}
console.log(generateFrameworkBadges(userChosenBadges))