0

Писал вот такой вот калькулятор. Однако столкнулся с проблемой, что нельзя загнать арифметический знак в переменную, потому что арифметический знак становится строковым, а если арифметический знак попытаться перевести в численный функцией, то выдает ошибку. Как быть?

Хотелось сделать что-то вроде массива и чтобы знак подставлялся в зависимости от условия, типа:

let devide = parseInt(/)
res.innerHTML = parseInt(val1.value) +devide+ parseInt(val2.value);

Но так не работает, поэтому сделать смог калькулятор только так:

    // Получаем значение из полей input
let val1 = document.querySelector('input[name=val1]')
let val2 = document.querySelector('input[name=val2]')
let btn = document.querySelectorAll('input[type=submit]')
let res = document.querySelector('.res')

// Обходим массив через цикл и если условие соотвествует, то подставляем нужный знак
for (let i = 0; i < btn.length; i++) {
    btn[i].onclick = function () {
        if (btn[i].value === '-') {
            res.innerHTML = parseInt(val1.value) - parseInt(val2.value);
            this.setAttribute('disabled', 'disabled')
        }
        else if (btn[i].value === '+') {
            res.innerHTML = parseInt(val1.value) + parseInt(val2.value);
            this.setAttribute('disabled', 'disabled')
        }
        else if (btn[i].value === '/') {
            res.innerHTML = parseInt(val1.value) / parseInt(val2.value);
            this.setAttribute('disabled', 'disabled')
        }
        else if (btn[i].value === '*') {
            res.innerHTML = parseInt(val1.value) * parseInt(val2.value);
            this.setAttribute('disabled', 'disabled')
        }
        else {
            console.log('error');
        }
    }
}
2
  • что мешает хранить арифметический знак в отдельной строке? Так будет легче, а именно просто бросил этот ар-знак в switch а там по веткам свое действие
    – sair
    7 янв 2019 в 11:43
  • Что-то больно хитрое вы делаете. Можно посмотреть на внешний вид калькулятора?
    – bashrc
    7 янв 2019 в 11:46

2 ответа 2

3

Попробуйте воспользоваться такой конструкцией

const functions = {
    '+': (a, b) => a + b,
    '-': (a, b) => a - b,
    '*': (a, b) => a * b,
    '/': (a, b) => a / b
};
const sign = '+';
const result = functions[sign](3, 5);
console.log(result);

3
  • а можете пояснить, что происходит? я такие массивы еще не изучал! 7 янв 2019 в 15:00
  • functions - это объект, у которого ключи это арифметические знаки +, -, *, /, а значения - стрелочные функции с соответствующими арифметическими операциями. Такой объект - это альтернатива конструкции switch-case.
    – Vladimir
    7 янв 2019 в 16:48
  • круто. спасибо! 8 янв 2019 в 17:46
2

Можно использовать eval:

var a = 1,
    b = 2,
    sign = "+";

var result = eval(a + sign + b);

console.log(result);

Но я бы просто код аккуратнее оформил:

for (let i = 0; i < btn.length; i++) {

    btn[i].onclick = function () {

        let val1 = +val1.value,
            val2 = +val2.value,
            result;

        switch (btn[i].value) {
            case '-':
                result = val1 - val2;
                break;
            case '+':
                result = val1 + val2;
                break;
            case '/':
                result = val1 / val2;
                break;
            case '*':
                result = val1 * val2;
                break;
        }

        res.innerHTML = result;

        this.setAttribute('disabled', 'disabled');

    }

}

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.