18

Is there a better way to add x amount of white space to a string?

str = "blah";
x = 4;

for (var i = 0; i < x; i++){
  str = ' ' + str;
}

return str;
George Kagan
  • 5,913
  • 8
  • 46
  • 50
K3NN3TH
  • 1,458
  • 2
  • 19
  • 31
  • Define 'better.' Incidentally: http://stackoverflow.com/questions/14343844/create-a-string-of-variable-length-filled-with-a-repeated-character – David Thomas Sep 14 '14 at 00:12
  • If performance matters, you're doing a lot of unnecessary string concatenations when x becomes high. Imagine you wanted 512 spaces. Concatenating two strings of 256 spaces would be faster than prepending a space 512 times. On my phone but this is usually called left and right padding of strings. – Warty Sep 14 '14 at 00:13
  • no point having a loop if you are always adding the same amount of padding – charlietfl Sep 14 '14 at 00:14
  • There's a "padding function" in *web browsers*. What are you trying to achieve? Why do you want those spaces? – Pointy Sep 14 '14 at 00:15
  • you can check it in this question http://stackoverflow.com/a/202627/2464118 – Raeef Refai Sep 14 '14 at 00:15
  • 1
    Have a look at the String.repeat method: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat –  Sep 14 '14 at 00:17
  • @Pointy I have a – K3NN3TH Sep 14 '14 at 00:43
  • OK then, that explains a lot. Carry on :) – Pointy Sep 14 '14 at 00:46
  • just trying to make the json object easier to read and edit for people with no programming experience, that way I dont have to create a screen for every part of the application, if you know what i mean – K3NN3TH Sep 14 '14 at 00:52

6 Answers6

36

Could do it like this, prevents the loop.

str = str + new Array(x + 1).join(' ')

Ross Rogers
  • 23,523
  • 27
  • 108
  • 164
Declan Cook
  • 6,066
  • 2
  • 35
  • 52
  • 4
    This gives a length of `x - 1` because join takes the element at right and the last element does not have one. So it should be `new Array(x + 1).join(' ')` – axelduch Sep 14 '14 at 00:19
  • 7
    Also, it should be `str = new Array(x+1).join(' ') + str;`. Your version pads on the wrong side. – p e p Sep 14 '14 at 00:22
  • 1
    Durp, you are correct this pads to the right. I didn't read the question properly. Guess its to late in the night for me. – Declan Cook Sep 14 '14 at 00:23
  • 2
    it is all good, i figured out to put it on the other side, just waiting for time to run out to give answer – K3NN3TH Sep 14 '14 at 00:24
  • 1
    Yeah definitely, I just pointed it out since @aduch also pointed something out. Very elegant solution by the way. – p e p Sep 14 '14 at 00:26
  • Doesnt work, collapses all the white spaces, any better methods to insert whitespace? – PirateApp Jan 01 '18 at 11:30
25

In ES6 you can do the following:

str = ' '.repeat(x) + str;

At this point in time (late 2014) it's only available in Chrome and Firefox. But in two years it should be widely supported.

See the documentation for more info: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/repeat

slebetman
  • 109,858
  • 19
  • 140
  • 171
2

Alternatively using lodash _.padStart. Pads string on the left side if it's shorter than length.

const str = 'blah',
  len = str.length,
  space = 4;
console.log(_.padStart(str, len + space));
// => '    blah'
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.js"></script>

Or pure JavaScript:

const str = 'blah',
  len = str.length,
  space = 4;
console.log(str.padStart(len + space, ' '));
Penny Liu
  • 15,447
  • 5
  • 79
  • 98
1

for example you can use repeat for the white space left or right of your string:

var j = 6;
for (i = 0; i < n; i++) {
    console.log(" ".repeat(j-1)+"#".repeat(i+1))
    j--;
}
Ezequiel García
  • 2,616
  • 19
  • 12
1

You can use padStart and padEnd methods. For eg.:

const str1 = 'Hello';
const str2 = 'World';
const str3 = str1.padEnd(2,' ')+str2.padStart(1,' ');
console.log(str3);
Dmitry S.
  • 1,544
  • 2
  • 13
  • 22
Vikram Aditya
  • 117
  • 6
1
var message = 'stack' + Array(6).fill('\xa0').join('') + 'overflow'
console.log(message);


var message = 'stack' + Array(6).fill('\xa0').join('') + 'overflow'
console.log(message);
pgksunilkumar
  • 236
  • 2
  • 5