TypeScript：遍历对象生成新属性值为字符串而非整数的问题

哈哈，这个问题我之前踩过一模一样的坑！核心原因其实很简单——JavaScript中对象的键无论你初始定义时是数值还是其他类型，最终都会被自动转换为字符串类型，哪怕你看着像是数值键，遍历的时候拿到的其实都是字符串形式。

比如你用for...in遍历对象、调用Object.keys()或者Object.entries()，返回的键值都是字符串，这就是为什么你最终得到的out.source和out.target会是字符串类型，而不是你预期的数值。

几种快速转为数值类型的方法： #

• 用Number()显式转换：这是最直观的方式，可读性强

  const nodeIDs = { 0: 'foo', 1: 'bar', 2: 'baz' };
  const out = { source: null, target: null };
  
  // 遍历找目标值对应的键
  for (const keyStr in nodeIDs) {
    if (nodeIDs[keyStr] === 'foo') {
      out.source = Number(keyStr); // 把字符串键转为数值
    }
    if (nodeIDs[keyStr] === 'baz') {
      out.target = Number(keyStr);
    }
  }
  
  console.log(typeof out.source); // 输出 "number"
  

• 用一元加号+隐式转换：写法更简洁，适合追求代码紧凑的场景

  out.source = +keyStr; // 同样能把字符串转为数值
  

• 用Object.entries()遍历并解构：如果需要同时拿到键和值，这种方式更清晰

  for (const [keyStr, value] of Object.entries(nodeIDs)) {
    if (value === 'foo') {
      out.source = Number(keyStr);
    }
  }
  

补充说明： #

为什么数组的索引是数值类型的感觉？其实数组本质也是对象，它的索引同样会被转为字符串，但JavaScript在处理数组时会自动把字符串索引转为数值，所以我们日常使用时感知不到。但普通对象没有这个自动转换机制，必须手动处理键的类型转换。

别担心，这个是JavaScript对象的基础特性，很多新手都会碰到，只要记住对象键的字符串特性，加一步显式转换就完美解决啦！

内容的提问来源于stack exchange，提问作者Mka24