在每个单词之前添加“@”+每个单词之间的一个空格（JavaScript）？

Question

我把一个代码放在一起，在输入字段中一个写单词，输出显示相同的单词，但附加了@，每个单词之间有一个空格。 到目前为止，我拥有的代码是半功能的，它可以做我想做的事情，但有一些问题。

我需要一些帮助：

1.我需要确保输出的字符之间总是有一个空格。 如果用户输入（键入或粘贴）一个包含多个“空格”的句子，则输出会将其缩小为一个空格。 如你看到的：

目前如果你输入：tomato, orange, (double space) apple，它会输出@tomato @orange @@ apple。

我希望它的输出是：@tomato @orange @apple（删除额外的@，由于双倍空格而插入）

2.删除输入字段中输入的所有内容时，输出仍显示“@”。 如果删除输入字段，我希望输出就像输入一样空白。

这是代码：

 function atPrefix (text) { return text .split(' ') .map(character => '@' + character) .join(' ') }

 <textarea id="specialInput" type="text" oninput="document.querySelector('#output').innerText = atPrefix(this.value)"></textarea> <p> <textarea id="output"> </textarea> </p>

Answer 1

添加一个filter()函数来过滤掉任何仅由空格组成的标记：

 function atPrefix (text) { return text .split(' ') .filter(token => token.trim() !== '') .map(token => '@' + token) .join(' ') }

 <textarea id="specialInput" type="text" oninput="document.querySelector('#output').innerText = atPrefix(this.value)"></textarea> <p> <textarea id="output"> </textarea> </p>

Answer 2

这样的事情应该工作

function atPrefix (text) {
  if(text) {
     return text
       .replace(/\s\s+/g, ' ')
       .split(' ')
       .map(character => '@' + character)
       .join(' ')
   } else {  return text }  
}

所以基本上你正在检查文本是否不是空字符串，并通过正则表达式用单个空格替换多个空格字符。

Answer 3

您的代码很好，但在拆分后只需使用 array.filter(e=>!!e);

 function atPrefix (text) { return text.split(' ') .filter(word => !!word) .map(word => '@' + word.trim()) .join(' ') }

 <textarea id="specialInput" type="text" oninput="document.querySelector('#output').innerText = atPrefix(this.value)"></textarea> <p> <textarea id="output"> </textarea> </p>

Answer 4

您可以在此处找到此正则表达式的解释： https : //regexr.com/4qgs7

 function atPrefix (text) { return text.replace(/\\b(\\w+)\\b/gm,"@$1"); }

 <textarea id="specialInput" type="text" oninput="document.querySelector('#output').innerText = atPrefix(this.value)"></textarea> <p> <textarea id="output"> </textarea> </p>

Answer 5

使用正则表达式将 ",?\\s+" 替换为 " @" 并以 @ 开头； 仅当它不为空时才进行字符串操作。 这将解决您的第二个问题。