Run results for: filter vs foreach loop test performance

Run details:

User agent: Mozilla/5.0 (iPhone; CPU iPhone OS 18_0_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/18.0.1 Mobile/15E148 Safari/604.1

Browser: Mobile Safari 18

Operating system: iOS 18.0.1

Device Platform: Mobile

Date tested: one year ago

Benchmark engine: Benchmark.js

filter+some+map

1.3M/s

filter+find+map

1.2M/s

forEach+push

872K/s

forEach

3K/s

View exact numbers

Test name	Executions per second
✓ filter+some+map	1,262,252 Ops/sec
filter+find+map	1,219,466 Ops/sec
forEach+push	872,307 Ops/sec
forEach	2,617 Ops/sec

Script Preparation code:

var a = [
  {id: 1, title: 'a1', key_a: 'key_a1'},
  {id: 2, title: 'a2', key_a: 'key_a2'},
  {id: 3, title: 'a3', key_a: 'key_a3'},
  {id: 4, title: 'a4', key_a: 'key_a4'},
];
var b = [
  {id: 1, title: 'b1', key_b: 'key_b1'},
  {id: 1, title: 'b11', key_b: 'key_b11'},
  {id: 2, title: 'b2', key_b: 'key_b2'},
  {id: 2, title: 'b22', key_b: 'key_b22'},
  {id: 5, title: 'b5', key_b: 'key_b5'},
];
var filterSomeMapResult = [],
    filterFindMapResult = [],
    forEachResult = [],
    forEachPushResult = [];

console.log('filterSomeMapResult', filterSomeMapResult);
console.log('filterFindMapResult', filterFindMapResult);
console.log('forEachResult', forEachResult);
console.log('forEachPushResult', forEachPushResult);

Tests:

filter+some+map
filterSomeMapResult = b .filter(bItem => a.some(aItem => aItem.id == bItem.id)) .map(item => ({ ...item, ...a.find(aItem => aItem.id === item.id) }))
filter+find+map
filterFindMapResult = b .filter(bItem => a.find(aItem => aItem.id == bItem.id)) .map(item => ({ ...item, ...a.find(aItem => aItem.id === item.id) }))
forEach
b.forEach(bItem => { const x = a.find(aItem => aItem.id == bItem.id); if(x) { forEachResult = [...forEachResult, { ...bItem, ...x }] } })
forEach+push
b.forEach(bItem => { const x = a.find(aItem => aItem.id == bItem.id); if(x) { forEachPushResult.push({ ...bItem, ...x }) } })