JQuery/JavaScript increment number

Question

I am trying to increment a number by a given value each second and retain the formatting using JavaScript or JQuery

I am struggling to do it.

Say I have a number like so:

1412015

the number which this can be incremented by each second is variable it could be anything beween 0.1 and 2.

Is it possible, if the value which it has to be incremented by each second is 0.54 to incremenet the number and have the following output:

1,412,016
1,412,017
1,412,018

Thanks

Eef

Solution 1

I'm not quite sure I understand your incrementation case and what you want to show. However, I decided to chime in on a solution to format a number.

I've got two versions of a number format routine, one which parses an array, and one which formats with a regular expression. I'll admit they aren't the easiest to read, but I had fun coming up with the approach.

I've tried to describe the lines with comments in case you're curious

Array parsing version:

function formatNum(num) {
    //Convert a formatted number to a normal number and split off any 
    //decimal places if they exist
    var parts = String( num ).replace(/[^\d.]-/g,'').split('.');
    //turn the string into a character array and reverse
    var arr = parts[0].split('').reverse();

    //initialize the return value
    var str = '';

    //As long as the array still has data to process (arr.length is 
    //anything but 0)
    //Use a for loop so that it keeps count of the characters for me
    for( var i = 0; arr.length; i++ ) {
        //every 4th character that isn't a minus sign add a comma before 
        //we add the character
        if( i && i%3 == 0 && arr[0] != '-' ) {
            str  = ',' + str ;
        }

        //add the character to the result
        str  = arr.shift() + str ;
    }

    //return the final result appending the previously split decimal place 
    //if necessary
    return str + ( parts[1] ? '.'+parts[1] : '' );
}

Regular Expression version:

function formatNum(num) {
    //Turn a formatted number into a normal number and separate the 
    //decimal places
    var parts = String( num ).replace(/[^\d.]-/g,'').split('.');
    //reverse the string
    var str = parts[0].split('').reverse().join('');
    //initialize the return value
    var retVal = '';

    //This gets complicated. As long as the previous result of the regular 
    //expression replace is NOT the same as the current replacement, 
    //keep replacing and adding commas.
    while( retVal != (str = str.replace(/(\d{3})(\d{1,3})/,'$1,$2')) ) {
        retVal = str;
    }

    //If there were decimal points return them back with the reversed string
    if( parts[1] ) {
        return retVal.split('').reverse().join('') + '.' + parts[1];
    }

    //return the reversed string
    return retVal.split('').reverse().join('');
}

Assuming you want to output a formatted number every second incremented by 0.54 you could use an interval to do your incrementation and outputting.

Super Short Firefox with Firebug only example:

var num = 1412015;

setInterval(function(){
    //Your 0.54 value... why? I don't know... but I'll run with it.
    num += 0.54;
    console.log( formatNum( num ) );
},1000);

You can see it all in action here: http://jsbin.com/opoze

Solution 2

To increment a value on every second use this structure:

var number = 0; // put your initial value here

function incrementNumber () {
    number += 1; // you can increment by anything you like here
}

// this will run incrementNumber() every second (interval is in ms)
setInterval(incrementNumber, 1000); 

This will format numbers for you:

function formatNumber(num) {
   num = String(num);

   if (num.length <= 3) {
      return num;
   } else {
      var last3nums = num.substring(num.length - 3, num.length);
      var remindingPart = num.substring(0, num.length - 3);
      return formatNumber(remindingPart) + ',' + last3nums;
   }
}

Solution 3

function rounded_inc(x, n) {
  return x + Math.ceil(n);
}

var x = 1412015;
x = rounded_inc(x, 0.54);

Comments

[RailsSon]

Thanks, I do not do that much javascript, is it possible to format the number like so 1,412,016 as well?

[Cristian Toma]

Your code only applies to numbers bigger than 6. What if he wants 1,548 ?