JSFiddle - React, Tailwind, and code Playground

by gaby de wilde

JavaScript

// this takes a while
function process1(input) {
  return input
    .filter((n) => n % 2 === 0)
    .map((n) => n * 2)
    .reduce((a, b) => a + b, 0)
}

function process2(input) {
  let sum = 0
  for (const n of input) {
    if (n % 2 !== 0) {
      continue
    }
    const doubled = n * 2
    sum += doubled
  }
  return sum
}

// flatmap
  function processflatmap(input) {
    return input
      .flatMap((n) => (n % 2 === 0 ? n * 2 : []))
      .reduce((a, b) => a + b, 0)
  }
  
function processfor(input) {
  let sum = 0
  for (let i = 0; i < input.length; i++) {
    if (input[i] % 2 !== 0) {
      continue
    }
    sum += input[i] * 2
  }
  return sum
}

// for laughs
function processPop(input) {
  let sum = 0,
    inp
  while ((inp = input.pop()) !== undefined) {
    if (inp % 2 !== 0) continue
    sum += inp * 2
  }
  return sum
}

function makeArray() {
  return Array.from({ length: 100000000 }, (_, i) =>
    Math.floor(Math.random() * 1000000),
  )
}

dothings = function () {
  const data = makeArray()
  console.time("1")
  process1(data)
  console.timeEnd("1")

  console.time("2")
  process2(data)
  console.timeEnd("2")

  console.time("flatmap")
  processflatmap(data)
  console.timeEnd("flatmap")

  console.time("oldskool for")
  processfor(data)
  console.timeEnd("oldskool for")

  console.time("array pop")
  processPop(data)
  console.timeEnd("array pop")
  console.log("--------------------------------")

  setTimeout(dothings, 2000)
}

dothings()