Марат Иванов

arr.reduce((acc, x) => ((acc[x.i] ??= []).push(x), acc), {})

const merge = (...arrs) =>
  Array.from(
    { length: Math.max(...arrs.map(n => n.length)) },
    (_, i) => Object.assign({}, ...arrs.map(n => n[i]))
  );


const arr = merge(arr1, arr2);

или

const merge = (...arrs) =>
  arrs.reduce((acc, n) => (
    n.forEach((m, i) => Object.assign(acc[i] ??= {}, m)),
    acc
  ), []);

const arr = [
  { id0: 200, sum0: 1000 },
  { id0: 200, sum0: 1000 },
  { id0: 200, sum0: 1000 },
  { id0: 200, sum0: 1000 },
  { id10: 300, sum300: 1500 },
  { id10: 300, sum300: 1500 },
  { id10: 300, sum300: 1500 },
];

const calc = arr.reduce(
  (acc, current) => {
    const key = Object.keys(current).find((key) => key.startsWith("id"));
    acc[key] ? acc[key]++ : (acc[key] = 1);
    if (acc[key] > acc.result.count) acc.result = { id: key, count: acc[key] };
    return acc;
  },
  { result: { id: null, count: 0 } }
);

console.log(calc.result)

const merge = (key, ...arrs) =>
  Object.values(arrs.flat().reduce((acc, n) => (
    Object.assign(acc[n[key]] ??= {}, n),
    acc
  ), {}));


const result = merge('id', sum, arr1, arr2);

или

const merge = (key, ...arrs) =>
  Array.from(arrs.reduce((acc, arr) => arr.reduce((acc, n) => {
    const k = key(n);
    return acc.set(k, Object.assign(acc.get(k) ?? {}, n));
  }, acc), new Map).values());


const result = merge(n => n.id, sum, arr1, arr2);

const result = arr.map(function(n) {
  return this[n];
}, Object.fromEntries(sum.map(n => [ n.id, n.name ])));

// или

const names = new Map(sum.map(n => [ n.id, n.name ]));
const result = arr.map(n => names.get(n));

// или

const result = arr.map(n => sum.find(m => m.id === n)?.name);

Но что если в массиве sum отсутствуют некоторые из нужных элементов, а получать undefined внутри массива с результатами не хочется?

Можно подставлять вместо отсутствующих элементов какое-нибудь дефолтное значение:

const result = arr.map(function(n) {
  return this[n] ?? 'объекта с таким id нет';
}, Object.fromEntries(sum.map(n => [ n.id, n.name ])));

Или есть вариант получать только то, что существует:

const names = new Map(sum.map(n => [ n.id, n.name ]));
const result = arr.reduce((acc, n) => (names.has(n) && acc.push(names.get(n)), acc), []);

Собрать новый массив:

const newArr = arr.reduce((acc, n) => (
  acc.push({ ...n, fractionTotal: n.fraction + (acc.at(-1)?.fractionTotal ?? 0) }),
  acc
), []);

// или

const newArr = arr.map(function({ ...n }) {
  n.fractionTotal = this[0] += n.fraction;
  return n;
}, [ 0 ]);

Изменить существующий:

arr.forEach((n, i, a) => n.fractionTotal = n.fraction + (i && a[i - 1].fractionTotal));

// или

arr.reduce((acc, n) => n.fractionTotal = acc + n.fraction, 0);

Object.values([
{key: 1, classifName: 'ABC', classifId: 1},
{key: 2, classifName: 'BCД', classifId: 2},
{key: 3, classifName: 'СДВ', classifId: 3},
{key: 1, classifName: 'ABC', classifId: 1},
{key: 1, classifName: 'ABC', classifId: 1},
].reduce((result, item) => {
     result[item.classifId] = item;
    return result;
}, {}))

type THash = {
  id: number;
  hash: string;
};
type TChannel = {
  channelid: number;
  childrenHash: THash[];
};
type TData = TChannel[];
type THashAcc = Record<THash["hash"], THash["id"][]>;

export const comparsion = (data: TData) =>
  data.map((n) => {
    const ids = Object.values(
      n.childrenHash.reduce<THashAcc>((acc, m) => ((acc[m.hash] ??= []).push(m.id), acc), {})
    ).filter((m) => m.length > 1);

    return {
      ...n,
      childrenHash: ids.length ? ids : null,
    };
  });

Нет смысла выделять первый id как особый, и добавлять к нему в массив match другие похожие — все id с одинаковыми прочими значениями равноправны. Поэтому предлагаю как результат просто массивы, где собраны id с совпадающими свойствами.

Понадобится хэш из ключей, исключая id, упорядоченных по алфавиту, и значений. Этот отпечаток будет одинаков у совпадающих объектов, несмотря на разные id (и разный порядок ключей).

Получаем объекты { id, hash }, затем составляем «словарь», где ключи – хэши, а значения – Set'ы с id, у которых оказался одинаковый хэш. Set'ы – чтобы не повторялись одинаковые id.

Потом остаётся из этих Set'ов сделать обычные массивы.

const arr = [
  { id: 1, we: 'cn', le: null },
  { id: 2, le: null, we: 'cn' },
  { id: 3, we: 'cn', le: 'car' },
  { id: 1, we: 'cn', le: null },
];

const dict = arr
  .map(({ id, ...obj }) => {
    const keys = Object.keys(obj).sort();
    const ordered = keys.reduce((acc, c) => {
      acc[c] = obj[c];
      return acc;
    }, {});
    return { id, hash: JSON.stringify(ordered) };
  })
  .reduce((acc, c) => {
    (acc[c.hash] ??= new Set()).add(c.id);
    return acc;
  }, {});

Object.values(dict).map(s => [...s]); // [ [1, 2], [3] ]

arr.map(n => {
  const ids = Object
    .values(n.childrenHash.reduce((acc, m) => ((acc[m.hash] ??= []).push(m.id), acc), {}))
    .filter(m => m.length > 1);

  return {
    ...n,
    childrenHash: ids.length ? ids : null,
  };
})

const result = data
  .flatMap(n => n.values)
  .filter(n => n.Ids.some(m => arr.includes(m)))
  .map(({ id, title }) => ({ id, title }));

или

const inArr = Set.prototype.has.bind(new Set(arr));
const data.reduce((acc, { values }) => (
  values.forEach(({ Ids, ...n }) => Ids.some(inArr) && acc.push(n)),
  acc
), []);

Делаем просто, ровно то, что спрошено в вопросе:

const result = allCass.filter(function(n) {
  return !this.has(n.id);
}, new Set(defaultCass.map(n => n.id)));

Делаем сложно, решаем задачу в более общем виде (источником данных могут быть не обязательно массивы; условие, по которому значения признаются равными, не будем зашивать непосредственно в код - будет параметром функции):

function* diff(data1, data2, key = n => n) {
  const getKey = key instanceof Function ? key : n => n[key];
  const keys = new Set;

  for (const n of data2) {
    keys.add(getKey(n));
  }

  for (const n of data1) {
    if (!keys.has(getKey(n))) {
      yield n;
    }
  }
}

В вашем случае применять так:

const result = [...diff(allCass, defaultCass, 'id')];

А можно и так:

Array.from(diff('abcdE', 'AcD', n => n.toLowerCase())) // ['b', 'E']

Или так:

for (const n of diff(Array(8).keys(), Array(5).keys())) {
  console.log(n); // 5 6 7
}

Составить массив id, которые нужно исключить

const excludeIds = defaultCass.map(item => item.id);

Затем отфильтровать, оставив только те, чей id отсутствует в excludeIds

const result = allCass.filter(item => !excludeIds.includes(item.id));

<Switch>
  <Route exact path="/services" component={Services} />
  <Route exact path="/login" component={Login} />
  <Route path="/" component={Wrapper} />
</Switch>

NotFound надо перенести в Switch компонента Wrapper.

Рассмотрите вариант:

const Header = ({ children }) => (
    <div className="navHeader">
      {children}
    </div>
  );

<Header>
  <Top />
</ Header>

Можно еще решить как-то так:

const Header = ({ top }) => {
  const HeaderTop = top || Top;
  
  return (
    <div className="navHeader">
      <HeaderTop />
    </div>
  );
};

Тогда у вас будет компонент по-умолчанию, а свойство top можно будет использовать только там, где необходимо использовать другой компонент.

<Header /> // используем компонент по-умолчанию Top

<Header top={OtherTopCompnent} /> // используем другой компонент