以及在卫兵条款中如何使用？

Question

hello i am learning javascript and stumble upon guard clause, i have a problem that i solved normally using nested if, but when i am trying refactor the code using the code, the output its not exactly what i want. so here my usual code :

 const numberLetters = (str) => { // Code disini var temp = ''; for(var x = 0; x < str.length; x++){ if (str[x] == 1){ temp += 'i'; } else if(str[x] == 4){ temp += 'a'; } else if(str[x] == 3){ temp += 'e'; } else if(str[x] == 7){ temp += 'u'; } else if(str[x] == 0){ temp += 'o'; } else { temp += str[x]; } } return temp; } // Test cases console.log(numberLetters('s3rg31dr4g7n0v')); // sergeidragunov console.log(numberLetters('b4d41')); // badai 

and here using guard clause :

 const numberLetters2 = (str) => { let temp = ''; for(var x = 0; x < str.length; x++){ if (str[x] == 1) return temp += 'i'; if (str[x] == 4) return temp += 'a'; if (str[x] == 3) return temp += 'e'; if (str[x] == 7) return temp += 'u'; if (str[x] == 0) return temp += 'o'; return temp += str[x] } } // Test cases console.log(numberLetters2('s3rg31dr4g7n0v')); // sergeidragunov console.log(numberLetters2('b4d41')); // badai 

it just get the first letter, i dont know why :(

Answer 1

It gets the first letter only because after the first match it returns the letter and gets out of the function. Set the values in all conditions and return in the end. Your first way is the right way to do it

 const numberLetters2 = (str) => { let temp = ''; for(var x = 0; x < str.length; x++){ if (str[x] == 1) temp += 'i'; else if (str[x] == 4) temp += 'a'; else if (str[x] == 3) temp += 'e'; else if (str[x] == 7) temp += 'u'; else if (str[x] == 0) temp += 'o'; else temp+=str[x] } return temp } // Test cases console.log(numberLetters2('s3rg31dr4g7n0v')); // sergeidragunov console.log(numberLetters2('b4d41')); // badai 

Answer 2

How about using an object for efficient look up of the values:

 const map = {"1": "i", "4" : "a", "3": "e", "7": "u", "0": "o"}; const numberLetters = (str) => { var temp = ''; for(var x = 0; x < str.length; x++){ temp += map[str[x]] || str[x]; //if map look up for the number succeeds add it with the temp, else take the character. } return temp; } // Test cases console.log(numberLetters('s3rg31dr4g7n0v')); // sergeidragunov console.log(numberLetters('b4d41')); // badai 

In your second code, you are returning after the first match is found or when no match is found. So always the first letter/one letter is seen in the console.

for(var x = 0; x < str.length; x++){
    if (str[x] == 1) return  temp += 'i';  //returned from here if the match is found, subsequent code block unreachable 
    if (str[x] == 4) return  temp += 'a';
    if (str[x] == 3) return temp += 'e';
    if (str[x] == 7)  return temp += 'u';
    if (str[x] == 0) return  temp += 'o'; 
    return temp += str[x] //this will be ignored if the any of the previous statements are satisfied.
}

So, in your case you cannot use return from the if blocks as you need to check for all the cases possible.

Answer 3

For this kind of problem, you can use a switch case and for a neater iteration, you can also use for...of

 const numberLetters2 = (str) => { let temp = ''; for(let char of str){ switch (char) { case '1' : temp += 'i'; break; case '4' : temp += 'a'; break; case '3' : temp += 'e'; break; case '7' : temp += 'u'; break; case '0' : temp += 'o'; break; default : temp += char; } } return temp; } console.log(numberLetters2('s3rg31dr4g7n0v')); // sergeidragunov console.log(numberLetters2('b4d41')); // badai