Extra Challenge -- Format Number Issue

Web Development
1

“Workaround Explorer Issue”

Having an issue with the final part of the “Workaround Explorer” project. I’ve built a working “Format Number” function that returns identical values to the solution code. Yet when I use my code, the “Details” on the output DOM don’t load (it works with the solution code). The import/export syntax is the same for both functions.

Any ideas on why my function doesn’t work and the solution code does?

// my formatNumber function here
export const formatNumber = (number) => {
let stringNum = String(Math.floor(number))
let indexLength = stringNum.length - 1;
let cleanNum = ‘’;
for (i = indexLength; i >= 0; i–) {
if (((indexLength - i) % 3 === 0) && (i !== indexLength)) {
cleanNum = stringNum[i] + ‘,’ + cleanNum;
} else {
cleanNum = stringNum[i] + cleanNum;
}
}
return cleanNum;
}

// the solution code (this works)
export const formatNumber = number => {
let numStr = String(Math.floor(number));
for (let i = numStr.length - 3; i > 0; i -= 3) {
numStr = numStr.slice(0, i) + ‘,’ + numStr.slice(i);
}
return numStr;
}

//from the main.js file:
import {formatNumber} from ‘./modules/utilities.js’

Link to lesson:
https://www.codecademy.com/paths/back-end-engineer-career-path/tracks/becp-22-javascript-syntax-part-iii/modules/wdcp-22-learn-javascript-syntax-modules/projects/es6-modules-workaround

2

An alternative would be to use the toLocaleString method. However I found that the calculations are rendered as strings, so I added an if/else statement to convert the string to number using the Number() constructor.

function formatNumber(number) {
  if (typeof number === 'number') {
    return number.toLocaleString('en-US');
  } else {
    return Number(number).toLocaleString('en-US');
  }
};
export { formatNumber };

hope that helps.