Method 1 array partition method

This method is also the easiest one to think of, by dividing the array by dots, and then concatenating the characters as one of three bits

function format_with_array(number) {
  // Convert to a string and follow the Break up
  const arr = (number + ' ').split('. ');
  // Re-split the integer part
  const int = arr[0].split(' ');
  // The decimal part
  const fraction = arr[1] | |' ';
  // The variable returned
  let r = ' ';
  int.reverse().forEach(function (v, i) {
    // If the digit is not the first digit and is a multiple of 3, add ","
    if(i ! = =0 && i % 3= = =0) {
      r = v + ', ' + r;
    } else {
      // Add characters normally (this is a good way to write)r = v + r; }});// The integer part is joined with the decimal part
  returnr + (!! fraction ?'. ' + fraction : ' ');
}
// Test case
console.log(format_with_array(1234567893.99));
Copy the code

Methods Two character interception method

Character interception, look at comments

function format_with_substring(number) {
  // The number is converted to a string and separated by
  let arr = (number + ' ').split('. ');
  let int = arr[0] + ' ';
  let fraction = arr[1] | |' ';
  // Extra digits
  let f = int.length % 3;
  // Get extra bits, f could be 0, r could be an empty string
  let r = int.substring(0, f);
  // Add ',' for each digit
  for (let i = 0; i < Math.floor(int.length / 3); i++) {
    r += ', ' + int.substring(f + i * 3, f + (i + 1) * 3);
  }
  // Extra digits, above
  if (f === 0) {
    r = r.substring(1);
  }
  // Adjust part and fractional part splicing
  returnr + (!! fraction ?'. ' + fraction : ' ');
}
console.log(format_with_substring(12112123313.78));
Copy the code

Method Three modulus method

This method is in accordance with the use of 1000 modulus to take the end of 3, and then use division to judge whether there are residual number of the method to do, this method performance is also the best, recommend everyone to use!

function format_with_mod(number) {
  let n = number;
  let r = ' ';
  let temp = ' ';
  do {
    // Get the number of decimal places
    mod = n % 1000;
    // Whether the value is greater than 1 is a continuation condition
    n = n / 1000;
    / / senior year
    temp = ~~mod;
    // 1. Fill: n > 1 before the loop ends, fill as 1 => 001
    // Otherwise, temp = ~~mod, 1 001, will become "11"
    // 2.
    r = (n >= 1 ? `${temp}`.padStart(3.'0') : temp) + (!! r ?', ' + r : ' ');
  } while (n >= 1);
  const strNumber = number + ' ';
  let index = strNumber.indexOf('. ');
  // Concatenate the decimal part
  if (index >= 0) {
    r += strNumber.substring(index);
  }
  return r;
}
console.log(format_with_mod(1234567893.99));
Copy the code

Method 4 Regular expressions (predicate first)

Before we talk about this method, let’s understand what preemptive assertion is. See the examples.

There are the following strings: I love you I love love love you

If you want to take out the word “love” and require the word “love” to be followed by you, you should write this, which is the antecedent assertion:

‘I love you I love love love you ‘. = you)/g) // [” love “, “love “]

If love is not followed by you, then there is an antecedent negative assertion:

‘I love you I love love love you ‘. ! You)/g) // [” love “, “love “], because match the same…

I love you. I love you. I love you.

‘I love you I love love love you ‘. <= I) love (? = you)/g) //

Finally, if there is no “I” before or “I” after the word “love”, then use the prior negative assertion and the subsequent negative assertion, ** as follows:

‘I love you I love love love you ‘.

So regular expressions are flexible, so let’s take a look at how regular expressions play with thousandths of code.

function format_with_regex(number) {
  return! (number +' ').includes('. ')?// This means that 1-3 bits must be matched with 3 bits
      (number + ' ').replace(/ \ d {1, 3} (? =(\d{3})+$)/g.(match) = > {
        return match + ', ';
      })
    : (number + ' ').replace(/ \ d {1, 3} (? =(\d{3})+(\.) )/g.(match) = > {
        return match + ', ';
      });
}
console.log(format_with_regex(1243250.99));
Copy the code

In line 4, the number d{1,3} appears 1-3 times, followed closely by 3 numbers, such as 1243250, first 243 is preceded by 1, so it is 1,243. 250 in the back and 243 in the front qualify, so 1,243,250

Method 5: Run intl.numberFormat

This approach, which I stumbled upon on the way up, leads to constant initialization of functions, which can cause performance problems.

function format_with_Intl(number, minimumFractionDigits, maximumFractionDigits) {
  minimumFractionDigits = minimumFractionDigits || 2;
  minimumFractionDigits = maximumFractionDigits || 2;
  maximumFractionDigits = Math.max(
    minimumFractionDigits,
    maximumFractionDigits
  );
  return new Intl.NumberFormat('en-us', {
    maximumFractionDigits: maximumFractionDigits || 2.minimumFractionDigits: minimumFractionDigits || 2,
  }).format(number);
}
console.log(format_with_Intl(123456789.98));
Copy the code

Method 6 number. ToLocaleString

This is through the API with JS, and method 5 will have the same performance problems.

function format_with_toLocalString(number, minimumFractionDigits, maximumFractionDigits) {
  minimumFractionDigits = minimumFractionDigits || 2;
  minimumFractionDigits = maximumFractionDigits || 2;
  maximumFractionDigits = Math.max(
    minimumFractionDigits,
    maximumFractionDigits
  );
  return number.toLocaleString('en-us', {
    maximumFractionDigits: maximumFractionDigits || 2.minimumFractionDigits: minimumFractionDigits || 2}); }console.log(format_with_toLocalString(123456789.58));
Copy the code