When I create template literals, I would use the trim() to remove extra space. But I noticed when I do this inside a JS function, it still creates extra tabs or white space.
function BottlesOfBeer() {
for (i = 99; i>=1; i--) {
if (i === 1) {
var oneBottle = "1 bottle of beer on the wall, 1 bottle of beer.\n" +
"Take one down and pass it around, no more bottles of beer on the wall.\n" +
"No more bottles of beer on the wall, no more bottles of beer.\n" +
"Go to the store and buy some more, 99 bottles of beer on the wall.";
console.log(oneBottle);
} else {
var lineOne = `
${i} bottles of beer on the wall, ${i} bottles of beer.
Take one down pass it around, ${i - 1} bottles of beer on the wall.
`.trim();
console.log(lineOne);
}
}
}
BottlesOfBeer();99 bottles of beer on the wall, 99 bottles of beer.
Take one down pass it around, 98 bottles of beer on the wall.
98 bottles of beer on the wall, 98 bottles of beer.
You can see how the first line appears normally, but the second one has all the necessary tabs.
break the statement into multiple template literals and connect them together the same way you did in the first text block, using the \n character to signify a new line
One solution is to break up the string into lines, and trim each of them.
const i = 1;
const lineOne = `
${i} bottles of beer on the wall, ${i} bottles of beer.
Take one down pass it around, ${i - 1} bottles of beer on the wall.
`.split("\n")
.map(s => s.trim())
// If you want to remove empty lines.
.filter(Boolean)
.join("\n");
console.log(lineOne)If it were me, in this case, I would just jam the text against the left, it still seems readable enough.
const lineOne = `${i} bottles of beer on the wall, ${i} bottles of beer.
Take one down pass it around, ${i - 1} bottles of beer on the wall.`;
You can use a global replace to remove double spaces and tabs and change it into single spaces, something really simple like:
let result = myStrToReplace.replaceAll("\t", "").replaceAll(" ", " ").trim();