Company logo
  • Empleos
  • Bootcamp
  • Acerca de nosotros
  • Para profesionales
    • Inicio
    • Empleos
    • Cursos y retos
    • Preguntas
    • Profesores
    • Bootcamp
  • Para empresas
    • Inicio
    • Nuestro proceso
    • Planes
    • Pruebas
    • Nómina
    • Blog
    • Comercial
    • Calculadora

0

85
Vistas
Inverting a math operation from + to -

I want to convert a math operation in Javascript. For example given a "-", it should get converted to a "+", "*" - "/" and so on.

My current code is a switch case, which is really slow to perform:

if (contents.className == "buttonfunction") {
                if (invert == true) {
                    switch (contents.innerHTML) {
                        case "+":
                            contents.innerHTML = "-";
                            break;
                        case "-":
                            contents.innerHTML = "+";
                            break;
                        case "*":
                            contents.innerHTML = "/";
                            break;
                        case "/":
                            contents.innerHTML = "*";
                            break;
                    }
                } 
                document.body.appendChild(contents);
            }

Is there a better/faster solution to this problem?

7 months ago · Santiago Trujillo
2 Respuestas
Responde la pregunta

0

Performance will be negligible but for operations that map a thing to another thing, a table-driven approach is often more maintainable in the long run:

const inverseOperations = {
 '+': '-',
 '-': '+',
 '/': '*',
 '*': '/',
};

if (contents.className == "buttonfunction") {
  const operation = contents.innerHTML
  if (invert == true && inverseOperations[operation]) {
    contents.innerHTML = inverseOperations[operation];
  }
  document.body.appendChild(contents);
}
 
7 months ago · Santiago Trujillo Denunciar

0

I added some context to make a running example.

By the way the approach used here is a map of rules for inversion, replacing the logic you were using in your switch statement:

let invert = true;

//granular map of pairs declaring the inverse of each operator
//it could be declared inline here but it could be also fed with the addInversionInMap
let inverted = {}; //{ '+' : '-', '-' : '+', '*' : '/', '/' : '*'}

addInversionInMap('+','-');
addInversionInMap('*','/');
//feeds the inverted map without repeating the both the sides in declaration
function addInversionInMap(op, opInverted){  
  inverted[op] = opInverted;
  inverted[opInverted] = op;  
}

//on document ready adds the click handler to every .buttonfunction elements
document.addEventListener("DOMContentLoaded", function() {
  addClickHandlerToButtonsFunction();
});

//adds the handler for click event on .buttonfunction
function addClickHandlerToButtonsFunction(){
  let btns = Object.values(document.getElementsByClassName('buttonfunction'));
  for(let btn of btns){
    btn.addEventListener('click', invertValue);
   }
}

//return the inverted operator based on the inverted map
//(or return the operator as is if there's no way to invert)
function getInvert(operator){
  if(inverted.hasOwnProperty(operator))
    return inverted[operator];
  else
    return operator;
}

//inverts the value of the element whose id is declared in the data-target attribvute
//of the button that triggered the click event (such element should be input type text)
function invertValue(){
  let contents = window.event.target;
  if (contents.className == "buttonfunction") {
    if (invert == true) {   
      let targetId = contents.getAttribute('data-target');
      let target = document.getElementById(targetId);
      //I'm using value so I expect the element to be input type text
      target.value = getInvert(target.value);
    }    
  }
}
button.buttonfunction{
  cursor: pointer;
}
<input id="input" type="text"></input>
<button type="button" class="buttonfunction" data-target="input">Invert</button>

7 months ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos