CODEWITHSUNDEEP
javascriptregex
ClaraU
ClaraU

Reputation: 977

Format number using regex in javascript

I am attempting to implement an auto-formatter in JS, such that if I have a given value (e.g. 12345678) and I have a given format (e.g. XX.XX.XX OR XX-XX-XX OR XX/XX/XX OR XXX-XXXX), I can auto-format my initial value to any of the given formats.

The required format will vary, so it needs to be able to take any given format and reformat the original value to match.

I have no idea if its possible or how to go about it. Any help appreciated.

Thanks,

Clara

Upvotes: 1

Views: 20705

Answers (3)

Denys Séguret
Denys Séguret

Reputation: 382454

Something like this ?

function format(mask, number) {
   var s = ''+number, r = '';
   for (var im=0, is = 0; im<mask.length && is<s.length; im++) {
     r += mask.charAt(im)=='X' ? s.charAt(is++) : mask.charAt(im);
   }
   return r;
}    

console.log(format('XX.XX.XX', 12345678)); // logs "12.34.56" 
console.log(format('XXX-XXXX', 12345678)); // logs "123-4567"
console.log(format('XX-XX-XX', 12345678)); // logs "12-34-56 "
console.log(format('XX/XX/XX', 12345678)); // logs "12/34/56"
console.log(format('XX/XX/XX/XX/XX', 12345678)); // logs "12/34/56/78"

No regex engine was harmed in the making of this code.

Fiddle

Upvotes: 12

Cerbrus
Cerbrus

Reputation: 72957

You can build a regex from a format, automatically, like this:

var format = 'XX-XX-XX';
var string = '111111';
var regex = '';

for(var i = 1; format.indexOf('X') >= 0; i++){
    format = format.replace('X', '$'+i);
    regex += '(\\d)'; // to match a digit enclosed in ()
}

Or as a function:

function format(string, format){
    var regex = '';

    for(var i = 1; format.indexOf('X') >= 0; ++i){
        format = format.replace('X', '$'+i);
        regex += '(\\d)';
    }
    regex += '[^]*'; // Match the rest of the string to crop characters overflowing the format.
// Remove this ^ line if you want `format('12345678', 'XX/XX/XX')` to return `12/34/5678` instead of `12/34/56`;
    return string.replace(new RegExp(regex), format);
}


console.log(format('111111', 'XX-XX-XX'));  // 11-11-11
console.log(format('111111', 'XX.XX.XX'));  // 11.11.11 
console.log(format('1111111', 'XXX-XXXX')); // 111-1111
console.log(format('111111', 'XX-XX-XX'));  // 11-11-11
console.log(format('111111', 'XX/XX/XX'));  // 11/11/11
console.log(format('123456789', 'XX/XX/XX'));  // 12/34/56 (789 are cropped off.)

Upvotes: 0

maček
maček

Reputation: 77816

This should work for you

var value = '12345678';

// 12345678 => 12.34.56.78
console.log(value.replace(/(\d{2})(?=\d)/g, '$1.'));

// 12345678 => 12/34/56/78
console.log(value.replace(/(\d{2})(?=\d)/g, '$1/'));

// 12345678 => 12-34-56-78
console.log(value.replace(/(\d{2})(?=\d)/g, '$1-'));

// 12345678 => 1234-5678
console.log(value.replace(/(\d{4})(?=\d)/g, '$1-'));

// a more complex format (create US phone number)
// 1234567890 => +1 (123)-456-7890
console.log('1234567890'.replace(/^(\d{3})(\d{3})(\d{4})$/g, '+1 ($1)-$2-$3'));

Upvotes: 18

Related Questions