如何摆脱字符串文字中的额外空间？

Question

代码如下：

const documentSigner = `${parameters.signor.surname} ${parameters.signor.name} ${parameters.signor.patronymic || ''}`;

如您所见，如果有父名，一切都会好起来的，但如果没有，就会有额外的空间。

如何处理？

Answer 1

将多余的空格移动到插值中，只有patronymic存在时才添加空格。

const { surname, name, patronymic } = parameters.signor;

const documentSigner = `${surname} ${name}${patronymic ? ` ${patronymic}` : ''}`;

Answer 2

如果变量不为空，您可以使用三元和嵌套模板字符串在变量前面添加一个空格：

function complexString(val1, val2) {
  return `${val1}${val2 ? ` ${val2}` : ''}!`;
}

console.log(complexString('hello', 'world'));
console.log(complexString('hello', ''));

或者您也可以使用逻辑和 (&&) 在两个部分之间插入空格：

function complexString(val1, val2) {
  return `${val1}${val2 && ' '}${val2}!`;
}

console.log(complexString('hello', 'world'));
console.log(complexString('hello', ''));

您可能需要修剪变量以使测试更加稳健：

`${val1}${val2 && val2.trim() ? ` ${val2}` : ''}!`;
`${val1}${val2 && val2.trim() && ' '}${val2}!`;

Answer 3

您可以使用 JavaScript 的“StringBuilder”，将要打印的元素添加到数组中，然后调用Array.prototype.join 方法。这会将所有元素连接成一个字符串，由提供给join 方法的字符串分隔。

这样您就不必重复连接器字符串，还可以更轻松地维护/改进其功能。

var text = [parameters.signor.surname, parameters.signor.name];
if(parameters.signor.patronymic) text.push(parameters.signor.patronymic);
const documentSigner = text.join(" ");