javascript - Chaining JS methods - Stack Overflow

admin管理员组

文章数量:1291426

I'm trying to insert some whitespace in a string if the string conforms to a certain format. Specifically, if the string consists of only numbers, and is exactly five characters in length, whitespace should be added between the third and fourth numbers.

Here's my test case:

function codeAddress() {
    var num_regex = /^\d+$/,
            input = $("#distributor-search").val(),
          address = (input.match(num_regex) && input.length == 5) ? input.split('').splice(3, 0 , ' ').join() : input ;

    console.log('The address is: ' + address);

    return false;
}

For some reason, chaining .split(), .splice() and .join() seems to not return anything. Where am I going wrong?

I'm trying to insert some whitespace in a string if the string conforms to a certain format. Specifically, if the string consists of only numbers, and is exactly five characters in length, whitespace should be added between the third and fourth numbers.

Here's my test case:

function codeAddress() {
    var num_regex = /^\d+$/,
            input = $("#distributor-search").val(),
          address = (input.match(num_regex) && input.length == 5) ? input.split('').splice(3, 0 , ' ').join() : input ;

    console.log('The address is: ' + address);

    return false;
}

For some reason, chaining .split(), .splice() and .join() seems to not return anything. Where am I going wrong?

• javascript
• jquery

Share Follow asked Jan 10, 2013 at 14:49 Jezen ThomasJezen Thomas 13.8k77 gold badges5454 silver badges9595 bronze badges 2

• 2 What's your input value? – Cerbrus Commented Jan 10, 2013 at 14:51
• Any five-digit string, i.e., '12345'. Did you look at the jsFiddle? – Jezen Thomas Commented Jan 10, 2013 at 14:52

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 7

split() returns an array, splice() returns the array with the removed elements and join() returns the joined array like they should.

Looks like everything goes wrong at splice(). Instead of giving the remainders, you get the removed items.

My test:

var input = '123,789';
var output = input.split(',').splice(1, 0, '456').join(',');

console.log(output); // outputs nothing, because `splice(1, 0, '456')` doesn't remove any values

You could solve this by making a prototype that uses splice's functionality, like so:

Array.prototype.isplice = function() {
    var tmp = this;

    Array.prototype.splice.apply(tmp, Array.prototype.isplice.arguments);

    return tmp;
};

var output = input.split(',').isplice(1, 0, '456').join(',');
console.log(output); // outputs ["123", "456", "789"] as expected

As others have explained, your function didn't work because .splice() returns the removed elements, instead of the resulting array.

Try using this regex, instead:

/^(\d\d\d)(\d\d)$/

It will only match a string if it's 5 digits long, it won't modify other strings.

Examples:

var s = '123456'.replace(/^(\d\d\d)(\d\d)$/, '$1 $2');
// "123456"
var s = '1234'.replace(/^(\d\d\d)(\d\d)$/, '$1 $2');
// "1234"
var s = '12345'.replace(/^(\d\d\d)(\d\d)$/, '$1 $2');
// "123 45"

So, in your case:

address = $("#distributor-search").val().replace(/^(\d\d\d)(\d\d)$/, '$1 $2');

Why not just use the regex itself?

var num_regex = /^(\d\d\d)(\d\d)$/,
        input = $("#distributor-search").val(),
      address = input.match(num_regex);
if (address) address = address[1] + ' ' + address[2];

That regex matches a five-digit string and groups the first three and last two digits together. If the test string matches, then the .match() function returns an array with the two groups in positions 1 and 2 (position 0 being the entire match).

You can't concatenate splice with join in your case:

splice(3, 0 , ' ').join()

remember that splice returns a new array containing the removed items, not the result array.

本文标签： javascriptChaining JS methodsStack Overflow