Сложить 3 строки, одна из них это математический знак(+, -, /, *) через js?

Question

[Skaizy]

Вот такая задача, не могу решить ее, у меня происходит простая конкатенация строк, а мне нужно чтобы произошло математическое действие, помогите!

<div>
<input type="number" class="i-141" value="8"></div>
<div><input type="number" class="i-142" value="7"></div>
            <div>
                <select class="s-143">
                    <option value="+">+</option>
                    <option value="-">-</option>
                    <option value="*">*</option>
                    <option value="/">/</option>
                </select>
            </div>
            <button class="button-primary b-14">Task-14</button>
            <div class="out-14"></div>"

JS:

function f14(){
let inputFirst = Number(document.querySelector(".i-141").value);
let inputSecond = Number(document.querySelector(".i-142").value);
let select = document.querySelector(".s-143").value;

document.querySelector(".out-14").innerHTML = inputFirst + select + inputSecond;
console.log(typeof inputFirst)
console.log(typeof inputSecond)
console.log(typeof select)
}

document.querySelector('.b-14').onclick = f14;

Суть, чтобы произошло математическое действие, а мне просто строку выдает

Answer 1

[Алексей Ярков]

eval в помощь

Comments

[Skaizy]

я так и сделал:
Number(document.querySelector(".i-141").value);

[Skaizy]

а в число преобразовать знаки такие как +-*/ я не могу и по этому не выходит

[Skaizy]

eval сработал, но может еще есть методы?

[Алексей Ярков]

Skaizy,

я так и сделал

Что сделал? У вас в коде нет eval.

Answer 2

[Skaizy]

подходящий вариант для меня вышел switch/case

пример решения, если у кого будет похожее:

switch (select) {
   case '+': answer.innerHTML = inputFirst + inputSecond;
   break;
   case '-': answer.innerHTML = inputFirst - inputSecond;
   break;
   case '*': answer.innerHTML = inputFirst * inputSecond;
   break;
   case '/': answer.innerHTML = inputFirst / inputSecond;
   break;
}

Comments

[Vlad]

Можно напиcать короче как предлагал Fedor Vlasenko:

answer.innerHTML = {
    '+': (a, b) => a + b,
    '-': (a, b) => a - b,
    '*': (a, b) => a * b,
    '/': (a, b) => a / b
} [select](inputFirst, inputSecond);

Answer 3

[Олег]

Comments

[Skaizy]

Да так сделал тоже, но eval() немного не то думаю в данном случае, решил использовать switch .
Но тоже спасибо за ответ и Ваше время.