JSFiddle - React, Tailwind, and code Playground

HTML

<pre id="c"></pre>

JavaScript

var toDecimal = (s) => {
    var n = 0;
    var X = {
        M: 1e3, CM: 900, D: 500, CD: 400, C: 100, XC: 90, 
        L: 50,  XL: 40,  X: 10,  IX: 9,   V: 5,   IV: 4,  I: 1
    };
    
    s.replace(/[MDLV]|C[MD]?|X[CL]?|I[XV]?/g, d => n += X[d]);
    
    return n;
};

var isRoman = (s) => s.match(/^[MDCLXVI]+$/);

var romanEnv = new Proxy(this, {
    get: (target, name) => isRoman(name) ? toDecimal(name) : target[name],
    set: (target, name, value) => isRoman(name) ? undefined : (target[name] = value),
    has: (target, name) => isRoman(name) || name in target,
    hasOwn: (target, name) => name in target
});

with (romanEnv) {
    var i = MIV + XLVIII;
    document.getElementById('c').innerHTML = 'MIV + XLVIII = ' + i;
}