How to add whitespace for array of IBAN properly

Question

I want to ask a question about regex.

I have an array of IBAN.

eg ["DE46700202700663820656", "DE07860700240455474700"]

I want to add whitespace between each 4 characters.

eg "DE46 7002 0270 0663 8206 56"

Currently I use this regex.

String(this.props.invoiceData.iban).replace(/(.{4})/g, '$1 ').split(',')

It could add whitespace but regex does not restart for a second IBAN and second IBAN is destroyed.

eg ["DE46 7002 0270 0663 8206 56", "D E078 6070 0240 4554 7470 0"]

What should I do to show two IBAN with proper whitespace as below?

eg ["DE46 7002 0270 0663 8206 56", "DE07 8607 0024 0455 4747 00"]

Answer 1

It could add whitespace but regex does not restart for a second IBAN and second IBAN is destroyed.

That's because the regex is keeping state. Either:

1. Create it each time, or

2. Set lastIndex to 0 before using it

Here's #1:

 var ibans = ["DE46700202700663820656", "DE07860700240455474700"]; ibans = ibans.map(function(iban) { return iban.replace(/(.{4})/g, '$1 '); }); console.log(ibans); 

Unless you're using an ancient JavaScript engine that has an issue with not recreating literal regular expressions each time (we're talking Firefox 3.0x or thereabouts), that should be fine.

Here's #2:

 var rex = /(.{4})/g; var ibans = ["DE46700202700663820656", "DE07860700240455474700"]; ibans = ibans.map(function(iban) { rex.lastIndex = 0; return iban.replace(rex, '$1 '); }); console.log(ibans); 

Obviously, both can be shortened if you can use ES2015+ arrow functions and such...

Answer 2

You can try like this using .map() :

 var a = ["DE46700202700663820656", "DE07860700240455474700"]; var b = a.map(i => i.replace(/(.{4})/g, '$1 ')); console.log(b)