JS使用for in有序获取对象数据

使用for in循环可以遍历对象中的属性和值。但是，由于JavaScript对象是无序的，因此for in循环的结果也可能是无序的。如果想要遍历对象时按照属性名有序获取数据，有以下几种方法可以尝试：

一、使用数组储存对象的键值

通过将对象的键值存储到数组中，然后进行排序就可以实现按照属性名有序获取对象数据。示例代码如下：

const obj = { b: 2, a: 1, d: 4, c: 3 };
const keys = Object.keys(obj).sort();
for (let i = 0; i < keys.length; i++) {
  const key = keys[i];
  console.log(key + ': ' + obj[key]);
}

解释如下：

1. 将对象obj的键值存储到一个数组中，使用Object.keys(obj)来获取所有的键名，然后使用sort()方法进行排序；
2. 利用for循环遍历排序后的键名数组，然后以键名为索引获取对应的属性值obj[key]，即可实现有序获取对象数据。

运行后的结果为：

a: 1
b: 2
c: 3
d: 4

二、使用Map数据结构储存键值

使用ES6中的Map数据结构可以实现按照属性名有序获取对象数据。示例代码如下：

const obj = { b: 2, a: 1, d: 4, c: 3 };
const map = new Map(Object.entries(obj).sort());
for (const [key, value] of map) {
  console.log(key + ': ' + value);
}

解释如下：

1. 将对象obj转换为一个二维数组，使用Object.entries(obj)获取键值对数组，然后使用sort()方法进行排序；
2. 利用new Map()将排好序的键值对数组传入构造函数，创建一个Map数据结构；
3. 利用for...of循环遍历Map中的键值对，然后以键名、值分别获取即可有序获取对象数据。

运行后的结果为：

a: 1
b: 2
c: 3
d: 4

总结：无论是使用数组还是使用Map数据结构，都可以实现有序获取对象数据，具体选择哪种方法视应用场景而定。