給定一個已命名的物件陣列，該陣列allItems已預先排序，但無法根據其包含的資訊再次排序 - 下面的 reduce 函式的替代實作是什么，它將保留 的排序順序allItems？

下面的邏輯將輸出：

[{ id: 'd' }, { id: 'a' }, { id: 'b' }]

所需的輸出是：

[{ id: 'a' }, { id: 'b' }, { id: 'd' }]

// NOTE: allItems is pre-sorted, but lacks the information to re-sort it
const allItems = [{id:'a'}, {id:'b'}, {id:'c'}, {id:'d'}, {id:'e'}, {id:'f'}];

const includedIds = ['d', 'a', 'b'];

// QUESTION: How to create the same output, but in the order they appear in allItems
const unsortedIncludedItems = includedIds.reduce((accumulator, id) => {
  const found = allItems.find(n => n.id === id);
  if (found) accumulator.push(found);
  return accumulator;
}, [])

正如在回復@Ben 時提到的那樣，出于性能原因，簡單地反轉邏輯是一個交易破壞者。

uj5u.com熱心網友回復：

而不是迭代includedIds（以錯誤的順序）并查看是否可以在 中找到它們allItems，只需迭代allItems（這是正確的順序）并查看是否可以在 中找到它們的 id includedIds：

const allItems = [{id:'a'}, {id:'b'}, {id:'c'}, {id:'d'}, {id:'e'}, {id:'f'}];

const includedIds = ['d', 'a', 'b'];

const includedItems = allItems.filter(item => includedIds.includes(item.id));

uj5u.com熱心網友回復：

您在這里遇到的問題是您的代碼反轉了串列。您可以簡單地推送到串列的前面，而原始順序將保持不變。

不幸的是，推到串列的前面更慢，它是 O(n) 而不是 O(1)。看起來Array.prototype.unshift應該更快，但根據此博客，它仍然是 O(n) 。假設找到的元素數量很少，您不會注意到任何性能問題。在這種情況下，替換push為unshift：

// NOTE: allItems is pre-sorted, but lacks the information to re-sort it
const allItems = [{id:'a'}, {id:'b'}, {id:'c'}, {id:'d'}, {id:'e'}, {id:'f'}];

const includedIds = ['d', 'a', 'b'];

// QUESTION: How to create the same output, but in the order they appear in allItems
const unsortedIncludedItems = includedIds.reduce((accumulator, id) => {
  const found = allItems.find(n => n.id === id);
  if (found) accumulator.unshift(found);
  return accumulator;
}, [])

否則，這些是您的選擇：

1. 在此物件周圍創建一個包裝器，用于反轉索引而不是陣列。這可以通過這樣的函式來完成：

   const getFromEnd = (arr, i) => arr[arr.length - 1 - i]

請注意，這可以arr.at(-i)在新的瀏覽器版本（最近幾個月）中替換。如果您傾向于 OOP，則可以將其封裝在一個類中。

2. 請記住在使用此陣列的任何地方手動反轉索引（這很容易出錯，因為您可能會忘記反轉它們）
3. 反轉陣列。如這個小提琴所示，即使有 10,000 個元素，性能也不錯。假設這不是熱點或用戶互動代碼，我認為即使是 100,000 也可能沒問題。

uj5u.com熱心網友回復：

更新

示例 B將使用輸入陣列的索引對過濾后的陣列進行排序。

嘗試.filter()并.include()獲取所需的物件，然后.sort()通過每個物件的字串值。見實施例A。

另一種方法是使用.flatMap()和.include()獲取陣列陣列。

// each index is from the original array
[ [15, {id: 'x'}], [0, {id: 'z'}], [8, {id: 'y'}] ]

然后.sort()在每個子陣列索引上使用。

[ [0, {id: 'z'}], [8, {id: 'y'}], [15, {id: 'x'}] ] 

最后，.flatMap()再次使用提取物件并將陣列陣列展平為物件陣列。

 [ {id: 'z'},  {id: 'y'},  {id: 'x'} ]

參見示例 B

示例 A（按值排序）

const all = [{id:'a'}, {id:'b'}, {id:'c'}, {id:'d'}, {id:'e'}, {id:'f'}];

const values = ['d', 'a', 'b'];

const sortByStringValue = (array, vArray, key) => array.filter(obj => vArray.includes(obj[key])).sort((a, b) => a[key].localeCompare(b[key]));

console.log(JSON.stringify(sortByStringValue(all, values, 'id')));

示例 B（按索引排序）

const all = [{id:'a'}, {id:'b'}, {id:'c'}, {id:'d'}, {id:'e'}, {id:'f'}];
const values = ['d', 'a', 'b'];

const alt = [{name:'Matt'}, {name:'Joe'}, {name:'Jane'}, {name:'Lynda'}, {name:'Shelly'}, {name:'Alice'}];
const filter = ['Shelly', 'Matt', 'Lynda'];

const sortByIndex = (array, vArray, key) => array.flatMap((obj, idx) => vArray.includes(obj[key]) ? [[idx, obj]] : []).sort((a, b) => a[0] - b[0]).flatMap(sub => [sub[1]]);

console.log(JSON.stringify(sortByIndex(all, values, 'id')));
   
console.log(JSON.stringify(sortByIndex(alt, filter, 'name')));

uj5u.com熱心網友回復：

為什么不只是顛倒邏輯，過濾掉不應該包含的 id。

// NOTE: allItems is pre-sorted, but lacks the information to re-sort it
const allItems = [
  { id: "a" },
  { id: "b" },
  { id: "c" },
  { id: "d" },
  { id: "e" },
  { id: "f" },
];

const includedIds = ["d", "a", "b"];

const findElms = (items, includedIds) => items.filter((n) => includedIds.includes(n.id))

console.log(findElms(allItems, includedIds));

標籤：javascript 数组 排序 ecmascript-6

上一篇：如何將小計添加到groupby并按降序排列這些小計類別？

下一篇：如何按名稱對具有匹配元素的值進行排序？