JS for in遍历对象顺序不对解决办法
作者：Mr-K
最近使用for-in语句遍历对象属性时发现遍历顺序并非属性构建顺序,这篇文章主要给大家介绍了关于JS for in遍历对象顺序不对的解决办法,需要的朋友可以参考下
后台返回对象参数展开后如下
当通过 for in 循环存放到数组的时候得到了
很显然顺序跟想象的不一样，因为对象中没有顺序，他不是数组，所以想要得到一个顺序就首先要只给对象指定规则，这里是通过对象的value的字母来指定的规则
//循环中使用
for(let item in this.objectOrder(data[0])){
this.ChartsTabData.push(item)
}
//方法
objectOrder(obj) {//排序的函数
var newkey = Object.keys(obj).sort(); //先用Object内置类的keys方法获取要排序对象的属性名，再利用Array原型上的sort方法对获取的属性名进行排序，newkey是一个数组
var newObj = {};//创建一个新的对象，用于存放排好序的键值对
for (var i = 0; i < newkey.length; i++) {//遍历newkey数组
newObj[newkey[i]] = obj[newkey[i]];//向新创建的对象中按照排好的顺序依次增加键值对
}
return newObj;//返回排好序的新对象
}结果如下
附：JavaScript for...in 循环出来的对象属性顺序到底是什么规律？
简单归结成一句话就是：先遍历出整数属性（integer properties，按照升序），然后其他属性按照创建时候的顺序遍历出来。
我们来看一个例子：
let codes = {
"49": "Germany",
"41": "Switzerland",
"44": "Great Britain",
"1": "USA"
};
for(let code in codes) {
alert(code); // 1, 41, 44, 49
}
最终遍历出来的结果是：属性 1 先遍历出来， 49 最后遍历出来。
这里的 1、41、44 和 49 就是整数属性。
那什么是整数属性呢？我们可以用下面的比较结果说明：
String(Math.trunc(Number(prop)) === prop
当上面的判断结果为 true，prop 就是整数属性，否则不是。
所以
"49"是整数属性，因为String(Math.trunc(Number('49'))的结果还是"49"。"+49"不是整数属性，因为String(Math.trunc(Number('+49'))的结果是"49"，不是"+49"。"1.2"不是整数属性，因为String(Math.trunc(Number('1.2'))的结果是"1"，不是"1.2"。
上面的例子中，如果想按照创建顺序循环出来，可以用一个 讨巧 的方法：
let codes = {
"+49": "Germany",
"+41": "Switzerland",
"+44": "Great Britain",
// ..,
"+1": "USA"
};
for(let code in codes) {
console.log( +code ); // 49, 41, 44, 1
}
总结
到此这篇关于JS for in遍历对象顺序不对解决办法的文章就介绍到这了,更多相关JS for in遍历对象顺序不对内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！