How to Convert Arabic Numerals to Roman Numerals with JavaScript

Converting Arabic numerals (i.e. the numbers we commonly use like 1, 2, 3, etc.) to Roman numerals is an interesting exercise to improve logic and programming skills. Roman numerals are a number system that uses letters of the Latin alphabet to represent numbers. In this article, we will see how to implement this conversion in JavaScript.

The Roman numeral system uses the following letters to represent specific values:

• I = 1
• V = 5
• X = 10
• L = 50
• C = 100
• D = 500
• M = 1000

For more complex numbers, symbols are combined following some rules:

• If a letter with a lower value precedes a letter with a higher value, the value of the first is subtracted from the second (e.g. IV = 4).
• If a letter with a higher value precedes a letter with a lower value, the values ​​are added (e.g. VI = 6).

The process of converting from Arabic numerals to Roman numerals can be divided into several steps steps:

1. Let's define a map that maps Arabic numerals to their Roman equivalents.
2. Let's create a function that iterates through the Arabic numerals and subtracts the highest possible value until the number is reduced to zero.
3. Each time we subtract an Arabic value, we add the corresponding Roman numeral to an output string.

Let's see how to implement this in JavaScript.

function convertToRoman(num) {
  // Define a map of Arabic numerals and their Roman equivalents
  const romanNumerals = [
    { value: 1000, symbol: 'M' },
    { value: 900, symbol: 'CM' },
    { value: 500, symbol: 'D' },
    { value: 400, symbol: 'CD' },
    { value: 100, symbol: 'C' },
    { value: 90, symbol: 'XC' },
    { value: 50, symbol: 'L' },
    { value: 40, symbol: 'XL' },
    { value: 10, symbol: 'X' },
    { value: 9, symbol: 'IX' },
    { value: 5, symbol: 'V' },
    { value: 4, symbol: 'IV' },
    { value: 1, symbol: 'I' }
  ];

  // Initialize a string to store the resulting Roman numeral
  let roman = '';

  // Loop through the map array
  for (let i = 0; i < romanNumerals.length; i++) {
    // For each value-symbol pair, subtract the Arabic value and add the Roman symbol
    while (num >= romanNumerals[i].value) {
      roman += romanNumerals[i].symbol;
      num -= romanNumerals[i].value;
    }
  }

  return roman;
}

// Example usage:
console.log(convertToRoman(1987)); // Output: MCMLXXXVII

Code explanation:

1. The conversion map: We created an array called romanNumerals that contains objects with pairs of value (Arabic numeral) and symbol (the corresponding Roman numeral). The order is important: we start with the highest numbers to ensure that the Roman numerals are constructed correctly.

2. Looping through the map: We use a for loop to go through each element of the array. For each element, we check whether the current Arabic numeral is greater than or equal to the value in the current object. If it is, we subtract the value and add the corresponding roman symbol to the output string.

3. while loop: The while condition ensures that we continue to subtract the same value and add the roman symbol until the number is greater than or equal to that value (for example, for the number 3000, we need to add "M" three times).

4. Returning the result: Finally, we return the roman string that contains the converted number.

Considerations:

1. Numbers out of range: Traditional roman numerals do not represent numbers greater than 3999. If you need to handle larger numbers, you can add extra logic or use more advanced roman notations such as the slash over the letters, which multiplies by 1000. However, these extensions are not generally used and are not covered by this example.

2. Input Validity: It is a good practice to add checks to handle invalid input, such as negative numbers or decimal numbers, that are not representable with Roman numerals.

Conclusion

Converting Arabic numerals to Roman numerals in JavaScript is an exercise that helps improve your ability to think algorithmically. The key is to use a well-ordered map and iterate through it, subtracting the appropriate value, gradually building up to the final Roman numeral. The implementation shown is simple and effective, and can easily be adapted for different needs or enhanced with additional features such as handling decimal numbers or invalid inputs.