js сортировка файлов в массиве

у меня есть массив с именами файлов

const names = [name1, name2, name3] // Массив строк

также у меня есть массив объектов, в каждом объекте есть поле name

const arr = [{name: 'name3', ...}, {name: 'name1', ...},{name: 'name2', ...},]

на выходе нужно получить, чтобы в массиве arr порядок объектов был правильный, таким какой он в массиве names

Я сделал так прямо и в лоб, может кто знает решение по красивше?

downloadInputFiles(apiFetcher, pTask).then(parentFiles => {
    console.log('order: ', order);
    const newParentFiles = [];
    for (let i = 0; i < order.length; i += 1) {
      const obj = parentFiles.find(item => item.name === order[i]);
      console.log(obj);
      newParentFiles.push(obj);
    }
    debugger;
    console.log('newParentFiles', newParentFiles);
    if (parentFiles) {
      setPrefetchedFiles(parentFiles);
    }

Ответы (2 шт):

Автор решения: ksa

на выходе нужно получить, чтобы в массиве arr порядок обектов был правельный, таким какой он в массиве names

Предложу такой вариант...

const names = ['name1', 'name2', 'name3']
let arr = [{name: 'name3'}, {name: 'name1'},{name: 'name2'}] 
const m = names.reduce((m, n, i) => (m.set(n, i), m), new Map())
arr = arr.reduce((a, o) => (a[m.get(o.name)] = o, a), [])
console.log(arr)

→ Ссылка
Автор решения: SwaD

На счет производительности не подскажу, будет ли эффект, но эстетически смотреться будет красивее.

Внимание! Код ниже будет мутировать исходный массив arr

const names = ['name1', 'name2', 'name3'];
const arr = [{name: 'name3'}, {name: 'name1'},{name: 'name2'},]

const newParentFiles = names.map(name => {
  // Находим индекс нужного элемента
  const indexFrom = arr.findIndex(item => item.name === name);
  // Вырезаем его из массива и возвращаем в новый
  return arr.splice(indexFrom, 1)[0];
});

console.log(newParentFiles);

Без мутации исходного

const names = ['name1', 'name2', 'name3'];
const arr = [{name: 'name3'}, {name: 'name1'},{name: 'name2'},]

const newParentFiles = names.map(name => arr.find(item => item.name === name));

console.log(newParentFiles);

По производительности на больших массивах эффект от первого варианта может быть, т.к. с каждой итерацией массив arr уменьшается, однако, стоит помнить, что при этом будут расходы на пересчет индексов.

Такое надо проверять отдельными тестами, никидать несколько вариантов и прогнать каждый несколько тысяч раз на разных объемах

→ Ссылка