JSFiddle - React, Tailwind, and code Playground

HTML

<form>
  <select class="form-select">
    <option value="#" selected="selected" disabled="">Выбрать</option>
    <option value="0">Всадной</option>
    <option value="1400">Сквозной (+1400)</option>
    <option value="1000">Цельнометаллический (+1000)</option>
  </select>
  <br>
  <select class="form-select">
    <option value="#" selected="selected" disabled="">Выбрать</option>
    <option value="1000">Текстолит (+1000)</option>
    <option value="8000">Латунь (+8000)</option>
    <option value="10000">Титан (+10000)</option>
  </select>
</form>
<pre id="display"></pre>

CSS

pre {
  margin: 1em;
  padding: 1em;
  outline: dashed 1px gray;
}

JavaScript

const startPrice = 5000
const form = document.querySelector('form')
const selects = form.querySelectorAll('select.form-select')
form.addEventListener('change', function() {
  let sum = startPrice
  selects.forEach(select => {
    const value = parseInt(select.value, 10) || 0
    sum += value
  })
  display.textContent = sum
})