JavaScript从JSON数组取值时如何保持指定索引数组的顺序

当输入索引数组为 var idx = [4, 6, 5] 时，现有代码运行输出结果如下：

i: 0 id: 4 rating: 999
i: 2 id: 5 rating: 333
i: 1 id: 6 rating: 666

期望得到的正确输出结果如下：

i: 0 id: 4 rating: 999
i: 1 id: 6 rating: 666
i: 2 id: 5 rating: 333

现有实现外层遍历data数组，内层循环匹配idx中的对应id，输出顺序完全跟随data数组的固有元素顺序，和idx数组指定的排列顺序不匹配。

现有错误实现代码：

var data = [{
    "id": 1,
    "rating": 55
  },
  {
    "id": 2,
    "rating": 22
  },
  {
    "id": 3,
    "rating": 111
  },
  {
    "id": 4,
    "rating": 999
  },
  {
    "id": 5,
    "rating": 333
  },
  {
    "id": 6,
    "rating": 666
  }
];

var idx = [4, 6, 5];

$.each(data, function() {
  for (var i = 0; i < idx.length; ++i) {
    if (idx[i] == this.id) {
      console.log('i: ' + i + ' id: ' + this.id + ' rating: ' + this.rating);
    }
  }
});

调整遍历逻辑，把遍历顺序反过来：外层遍历idx数组保证输出顺序和idx完全一致，内层从data中查找id匹配的对应条目即可。
修复后代码：

var data = [{
    "id": 1,
    "rating": 55
  },
  {
    "id": 2,
    "rating": 22
  },
  {
    "id": 3,
    "rating": 111
  },
  {
    "id": 4,
    "rating": 999
  },
  {
    "id": 5,
    "rating": 333
  },
  {
    "id": 6,
    "rating": 666
  }
];

var idx = [4, 6, 5];

$.each(idx, function(index, targetId) {
  // 查找data中id匹配的项
  var targetItem = data.find(function(item) {
    return item.id === targetId;
  });
  if (targetItem) {
    console.log('i: ' + index + ' id: ' + targetItem.id + ' rating: ' + targetItem.rating);
  }
});

运行上述代码即可得到和预期完全一致的输出。如果需要兼容不支持Array.prototype.find的老旧环境，可以把查找匹配项的逻辑替换为普通for循环实现，核心遍历顺序不需要改动。

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