为何for...in遍历数组时键为字符串？如何转为整数？

一、现象原因 #

JavaScript中的数组本质是特殊的对象，而对象的属性名（包括数组的索引）在底层只能是字符串或Symbol类型，这是JS对象的核心特性。

• array.keys()是数组专属的迭代器方法，它被设计为直接返回数组索引的整数数值形式，目的是让开发者能直接将其用作数组索引或进行数值运算，简化数组操作。
• for...in是通用的对象属性遍历语法，它会遍历对象的所有可枚举属性（包括数组的索引），并严格遵循对象属性名的规则，将所有属性名以字符串类型返回。

二、字符串键转整数的方法 #

可以通过以下几种常用方式将for...in拿到的字符串索引转换为整数：

1. 使用Number()函数 #

const array1 = ['a', 'b', 'c'];
for (const key in array1) {
  const numKey = Number(key);
  console.log(`Type of key ${numKey} is ${typeof numKey}`);
}
// 输出：
// Type of key 0 is number
// Type of key 1 is number
// Type of key 2 is number

2. 使用一元加号+ #

const array1 = ['a', 'b', 'c'];
for (const key in array1) {
  const numKey = +key;
  console.log(`Type of key ${numKey} is ${typeof numKey}`);
}

3. 使用parseInt()（需指定进制） #

const array1 = ['a', 'b', 'c'];
for (const key in array1) {
  const numKey = parseInt(key, 10);
  console.log(`Type of key ${numKey} is ${typeof numKey}`);
}

注意：for...in会遍历数组原型链上的可枚举属性，若仅需遍历数组自身的索引，更推荐使用for...of配合array.keys()，或普通的for循环，避免意外遍历到非数组索引的属性。

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