Run results for: Performance of JavaScript .forEach, .map and .reduce vs for and for..of2

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/117.0.0.0 Safari/537.36

Browser: Chrome 117

Operating system: Mac OS X 10.15.7

Device Platform: Desktop

Date tested: one year ago

Test name	Executions per second
.forEach	75.9 Ops/sec
for..of	76.2 Ops/sec
for..of (destructuring)	27.3 Ops/sec
.map	23.1 Ops/sec
.map (destructuring)	21.6 Ops/sec
.for (init array)	6.6 Ops/sec
.reduce	64.2 Ops/sec
.reduce (destructuring)	69.2 Ops/sec
for..of (reduce)	77.3 Ops/sec
for..of (reduce) (destructuring)	77.2 Ops/sec
forEach index	6.4 Ops/sec

Script Preparation code:

function generateTestArray() {
  const result = [];
  for (let i = 0; i < 1000000; ++i) {
    result.push({
      a: i,
      b: i / 2,
      r: 0,
    });
  }
  return result;
}
var array = generateTestArray();

Tests:

.forEach
array.forEach((x) => { x.r = x.a + x.b; });
for..of
for(const x of array) { x.r = x.a + x.b; }
for..of (destructuring)
const r = []; for(const {a, b} of array) { r.push(a + b); }
.map
array.map(x => x.a + x.b)
.map (destructuring)
array.map(({a,b}) => a + b)
.for (init array)
const r = new Array(array.length); for (let i = 0; i < array.length; ++i) { r[i] = array[i].a + array[i].b; }
.reduce
array.reduce((p, x) => p + x.a + x.b, 0);
.reduce (destructuring)
array.reduce((p, {a,b}) => p + a + b, 0);
for..of (reduce)
let r = 0; for (const x of array) { r += x.a + x.b; }
for..of (reduce) (destructuring)
let r = 0; for (const {a,b} of array) { r += a + b; }
forEach index
array.forEach((_, i) => { array[i].r = array[i].a + array[i].b; });

Run results for: Performance of JavaScript .forEach, .map and .reduce vs for and for..of2

.forEach

for..of

for..of (destructuring)

.map

.map (destructuring)

.for (init array)

.reduce

.reduce (destructuring)

for..of (reduce)

for..of (reduce) (destructuring)

forEach index