Javascript 使用下划线根据另一个数组顺序对数组顺序进行排序

Question

基本上是我的标题问题。我有两个 objects.

数组

数组 1:

var firstArray = [
{id: "1", value: 1},
{id: "5", value: 0.5},
{id: "3", value: 0.25},
{id: "4", value: 0.125},
{id: "2", value: 0.0625}
];

数组 2:

var secondArray = [
{id: 1, name: "a"},
{id: 2, name: "b"},
{id: 3, name: "c"},
{id: 4, name: "d"},
{id: 5, name: "e"}
];

如何对我的第二个数组进行排序，以便顺序与第一个数组顺序匹配，如下所示：

结果：

var secondArray = [
{id: 1, name: "a"},
{id: 5, name: "e"},
{id: 3, name: "c"},
{id: 4, name: "d"},
{id: 2, name: "b"}
];

Answer 1

使用纯 ES6，您可以将 Map 作为给定 id 的索引，并使用 firstArray.

的索引对其进行排序

问题是给定数组中 id 的类型不同。

var firstArray = [{ id: "1", value: 1 }, { id: "5", value: 0.5 }, { id: "3", value: 0.25 }, { id: "4", value: 0.125 }, { id: "2", value: 0.0625 }],
    secondArray = [{ id: 1, name: "a" }, { id: 2, name: "b" }, { id: 3, name: "c" }, { id: 4, name: "d" }, { id: 5, name: "e" }],
    map = new Map(firstArray.map(({ id }, i) => [+id, i]));

secondArray.sort((a, b) => map.get(a.id) - map.get(b.id));

console.log(secondArray);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 2

注意一些转换（一个数组的 id 是字符串，一个是数字），您可以使用 ES6 .map() (different from Nina's Map) and .find():

var firstArray = [
  {id: "1", value: 1},
  {id: "5", value: 0.5},
  {id: "3", value: 0.25},
  {id: "4", value: 0.125},
  {id: "2", value: 0.0625}
];

var secondArray = [
  {id: 1, name: "a"},
  {id: 2, name: "b"},
  {id: 3, name: "c"},
  {id: 4, name: "d"},
  {id: 5, name: "e"}
];

var result = firstArray.map(item => {
  return {
    id: Number(item.id),
    name: secondArray.find(element => element.id == item.id).name
  }
})

console.log(result)

Answer 3

给出 Underscore/Lodash 答案，因为这是问题标题表明 OP 所追求的。此代码根据第一个数组中相应 id 的索引对第二个数组进行排序。

$(function() {
    var firstArray = [
 {id: "1", value: 1},
 {id: "5", value: 0.5},
 {id: "3", value: 0.25},
 {id: "4", value: 0.125},
 {id: "2", value: 0.0625}
    ];
    var secondArray = [
 {id: 1, name: "a"},
 {id: 2, name: "b"},
 {id: 3, name: "c"},
 {id: 4, name: "d"},
 {id: 5, name: "e"}
    ];

    var sorted = _.sortBy(secondArray, function(obj) {
 return _.findIndex(firstArray, {id: obj.id.toString()});
    });

    console.log(sorted);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>

Answer 4

XY problem?

我感觉您计划在第二个数组排序后按索引关联两个数组。我建议另一种关系方式

const firstArray =
  [ {id: "1", value: 1}
  , {id: "5", value: 0.5}
  , {id: "3", value: 0.25}
  , {id: "4", value: 0.125}
  , {id: "2", value: 0.0625}
  ]

const secondArray =
  [ {id: 1, name: "a"}
  , {id: 2, name: "b"}
  , {id: 3, name: "c"}
  , {id: 4, name: "d"}
  , {id: 5, name: "e"}
  ]

const thirdArray =
  firstArray.map (x =>
    Object.assign (x, secondArray.find (y => y.id == x.id)))
    
console.log (thirdArray)
// [ { id: 1, value: 1, name: 'a' }
// , { id: 5, value: 0.5, name: 'e' }
// , { id: 3, value: 0.25, name: 'c' }
// , { id: 4, value: 0.125, name: 'd' }
// , { id: 2, value: 0.0625, name: 'b' } 
// ]

Javascript 使用下划线根据另一个数组顺序对数组顺序进行排序

Javascript Sort array order based on another array order using underscore

javascript

arrays

sorting

underscore.js