javascript - 如何构建长度转换器

Question

我对 JS 很陌生，想要创建一个基本转换器(mm、cm、dm、m、km)。我希望如果 mm 输入大于 0，则转换后的 cm 将被输入到 cm 输入中。有谁知道我做错了什么？

function convert() {
  let milliM = parseFloat(document.getElementById("mm").value);
  let centiM = parseFloat(document.getElementById("cm").value);
  let deciM = parseFloat(document.getElementById("dm").value);
  let Meter = parseFloat(document.getElementById("m").value);
  let kiloM = parseFloat(document.getElementById("km").value);

  let mm = parseFloat(document.getElementById("mm"));
  let cm = parseFloat(document.getElementById("cm"));
  let dm = parseFloat(document.getElementById("dm"));
  let m = parseFloat(document.getElementById("m"));
  let km = parseFloat(document.getElementById("km"));

  if (milliM > 0) {
    centiM = milliM / 10;
    cm.value = centiM;
  }
}

<h1>Converter</h1>
<h2>Length</h2>
<div class="container">
  <input type="text" id="mm" value="0"> mm
  <input type="text" id="cm" value="0"> cm
  <input type="text" id="dm" value="0"> dm
  <input type="text" id="m" value="0"> m
  <input type="text" id="km" value="0"> km
  <br>
  <button onclick="convert()">Convert</button>
</div>

Answer 1

米(m)作为引用单位:

const converter = {
    "mm": 1000,
    "cm": 100,
    "dm": 10,
    "m": 1,
    "km": 0.001,
    "mile": 3.600/3.937 * 1.760
};

示例

将30 dm转换为公里

let res = 30 * 0.001 / 10;
console.log(res);

完整的解决方案

// Meter as reference unit
const converter = {
  "mm": 1000,
  "cm": 100,
  "dm": 10,
  "m": 1,
  "km": 0.001,
  "mile": 3.600 / 3.937 * 1.760
};

const units = Object.keys(converter);

function convertAll(currentValue, currentUnit) {
  units.forEach((unit) => {

    // If not the current input
    if (unit !== currentUnit) {
      let input = document.getElementById(unit);
      input.value = Number(currentValue) * converter[unit] / converter[currentUnit];
    }
  })
}

units.forEach((unit) => {
  let input = document.getElementById(unit);
  input.addEventListener("input", function() {
    convertAll(this.value, this.id);
  })
})

ul {
  list-style: none;
  padding: 0;
}

ul span {
  margin-left: 5px;
}

<ul>
  <li><input type="text" id="mm" value="0"><span>mm</span></li>
  <li><input type="text" id="cm" value="0"><span>cm</span></li>
  <li><input type="text" id="dm" value="0"><span>dm</span></li>
  <li><input type="text" id="m" value="0"><span>m</span></li>
  <li><input type="text" id="km" value="0"><span>km</span></li>
  <li><input type="text" id="mile" value="0"><span>mile</span></li>
</ul>