How To Generate Roman Numerals 1 To 3999 In Javascript

Have you ever wanted to learn how to generate the Roman Numerals 1 Through 3999? Well, this article does just that. This article will show you code on how to generate Roman Numerals from 1 to 3999 In JavaScript.

Image via pixabay.com

We  showed all Roman Numerals from 1 to 3999 in a previous article, but we didn’t show how to generate the code there. This article includes the code to generate Roman Numerals 1 to 3999 in 2 files: a JavaScript file and an HTML file.

The code below shows you JavaScript code that will generate all Roman Numerals from 1 to 3999 upon a user clicking on a button which says Generate Roman Numerals.”

 
function convertToRoman(num) {
  romanNumerals = [[1000,'M'], [900, 'CM'], [500, 'D'], [400, 'CD'], [100, 'C'],
  [90, 'XC'], [50, 'L'], [40, 'XL'], [10, 'X'], [9, 'IX'], [5,'V'], [4,'IV'], [1,'I']];
  result = ""
  for (var i=0; i < romanNumerals.length; i++) { while (num >= romanNumerals[i][0]) {
      num -= romanNumerals[i][0];
      result += romanNumerals[i][1];
    }
  }
  return result
}

var displayArea = document.getElementsByClassName('roman-numerals-display')[0];
var userButton = document.querySelector("button");
var romanString = ""
userButton.addEventListener("click", function() {
  for (var i=1; i < 4000; i++) {
    romanString = romanString + String(i) + " : " +  convertToRoman(i) + "\n";
  }
  displayArea.innerText = romanString;
});

The HTML code accompanying the JavaScript code above is below:

To run the file, just  have both the JavaScript and HTML files in one folder, open the index.html file, and then click on the button which says “Generate Roman Numerals”. If you would like, you can download the JavaScript code as a file called convertToRoman.js here, and you can download the HTML code called index.html here.

What did you think of this article? Did you learn much? Let’s discuss it in the comments below.


🚀 Embark on an Epic Time-Travel Adventure with Watson! 🐕🦖🎨

Take a journey through time with Watson the Time-Travelling Dog: Dogs and Dinosaurs Adventure Coloring Book 1.

Join Watson and his dog brother Sherlock as they meet dinosaurs, make new friends, and embark on an unforgettable adventure! Perfect for kids, dog lovers, and coloring book enthusiasts alike.

Why you'll love it:

  • Engaging, fun-filled story
  • Beautiful illustrations to color
  • Ideal for family fun or a thoughtful gift

Ready for an adventure that sparks creativity and fun? 📖 Grab your copy today and let the time-traveling excitement begin!

Get your book now 👇

Get your book here!

One thought on “How To Generate Roman Numerals 1 To 3999 In Javascript”

  1. Looks good. The code is short and to the point. I would have liked an explanation of why the convertToRoman() function works as it does (maybe stepping through an example).

    Also, the “while” should probably be indented on a new line rather than on the same line as the “for.”

    I rate it IX out of X 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *