Doubt with map and split of string

As a special comment, when you transmit a message in morse code there is a pause between letters. For example, when you transmit "et" the message is .<pausa>- and not .- that would read the same as the letter "a". For the same reason, it seems to me that in your exercise each letter in morse you must separate it for example with a space. In the same way, to differentiate an explicit space (between words) from this implicit pause, your ASCII - Morse dictionary has a | for spaces. Between amateurs usually a point lasts a tick , a line lasts three ticks and a silence of three ticks indicates that the letter ended and another will start. A pause of seven ticks indicates that one word is over and another comes.

That said, in javascript (and other languages) a string behaves similar to an array. It has a length attribute as the total length of the text, and its characters can be accessed using .charAt(posicion) , so you do not need to exploit the input text to go through it.

Even if you exploit the text by separating it into an array of words, you do not need to exploit each word in letters. In your code, on the other hand, you would not achieve that by exploiting a word using .split(' ') since the word does not contain spaces within itself. What you wanted to do would be achieved by exploiting with .split('') which is literally converting a string into an array of characters. That, as I told you, is not necessary since the string itself can be treated as an array.

I leave you a snippet that takes everything you write in an input and transforms it into morse with two rules:

• Each letter is a morse code followed by a space (to distinguish it from the code that follows)
• Each space is explicitly a | separator according to your dictionary. This is an arbitrary convention based on your dictionary and not on the convention between radio amateurs.

var MORSE_CODE = {"a": ".-", "b": "-...", "c": "-.-.", "d": "-..", "e": ".", "f": "..-.", "g": "--.", "h": "....", "i": "..", "j": ".---", "k": "-.-", "l": ".-..", "m": "--", "n": "-.", "o": "---", "p": ".--.", "q": "--.-", "r": ".-.", "s": "...", "t": "-", "u": "..-", "v": "...-", "w": ".--", "x": "-..-", "y": "-.--", "z": "--..", "1": ".----", "2": "..---", "3": "...--", "4": "....-", "5": ".....", "6": "-....", "7": "--...", "8": "---..", "9": "----.", "0": "-----", " ": "|"};

function charToMorse(char) {
   return (MORSE_CODE[char]||'') +' ';
}

function encodeMorse(value){
      var salida='',
          largo = value.length;
      for(var i=0; i<largo; i++) {
         salida+=charToMorse(value.charAt(i));
      }
      document.querySelector('#resultado').innerText=salida.trim();
}


document.querySelector('#entrada').addEventListener('keyup',function(e) {
  encodeMorse(this.value.toLowerCase().trim());
});

.contenedor {
float:left;margin-right:3px;width:40%;
}
#entrada {
width:90%;
}
#resultado {
width:90%;
height:50px;
}

<div class="contenedor" >
<p>El texto</p>
<input type="text" id="entrada">
</div>
<div class="contenedor">
<p>Se convierte a</p>
<textarea id="resultado"></textarea>
</div>

Edit : at the suggestion of the OP Pablo Rodríguez , I just included the logic to transform to lowercase before the transformation. Another approach would involve repeating code or encountering characters without translation.

I put an input, where you type a word and print it back what you wrote and the string in morse key:

var MORSE_CODE = {"a": ".-", "b": "-...", "c": "-.-.", "d": "-..", "e": ".", "f": "..-.", "g": "--.", "h": "....", "i": "..", "j": ".---", "k": "-.-", "l": ".-..", "m": "--", "n": "-.", "o": "---", "p": ".--.", "q": "--.-", "r": ".-.", "s": "...", "t": "-", "u": "..-", "v": "...-", "w": ".--", "x": "-..-", "y": "-.--", "z": "--..", "1": ".----", "2": "..---", "3": "...--", "4": "....-", "5": ".....", "6": "-....", "7": "--...", "8": "---..", "9": "----.", "0": "-----", " ": "|"};
    
function encodeMorse(cadena){
     //Removemos los espacios del split en words y letters
      var words = cadena.split('');
      var letters = words.map((w) => w.split(''));
      var encoded = [];
    
      for(var i = 0; i < letters.length; i++){
        encoded[i] = [];
        for(var x = 0; x < letters[i].length; x++){
            if(MORSE_CODE[letters[i][x]]){
                encoded[i].push( MORSE_CODE[letters[i][x]]);
            }
        }
      }
      return encoded.map(arr => arr.join('')).join(' ');
}

function do_code(){
    var x =	document.getElementById('morse_res').value;
    console.log(x);
    var y = encodeMorse(x);
    console.log(y);
}

<input type="text" id="morse_res"/>


<button onclick="do_code()">Click me</button>

According to the code, you must write the words with spaces since on that basis you use the split , you can make the split work for each letter by removing the spaces in between.

I hope it's your help.