Higher-Order Array Methods

map Transformations

Create a new array by transforming each value.

map-transform `map` returns a new array. The original array stays the same while the callback decides the replacement value for each element.

map Transformations

scale
map_transform.js
Replay: real traced execution (multi-file project)
const scale = 2;
const base = [2, 4, 6];
const adjusted = base.map((value) => value * scale);

console.log("scale=" + scale);
console.log("adjusted=" + adjusted.join(","));

const scale = 3;
const base = [2, 4, 6];
const adjusted = base.map((value) => value * scale);

console.log("scale=" + scale);
console.log("adjusted=" + adjusted.join(","));

const scale = 4;
const base = [2, 4, 6];
const adjusted = base.map((value) => value * scale);

console.log("scale=" + scale);
console.log("adjusted=" + adjusted.join(","));

  1. scale ← 2, base ← 2,4,6, adjusted ← 4,8,12

    1const scale→ 2 = 2; //@scale=3, 42const base→ 2,4,6 = [2, 4, 6];3const adjusted→ 4,8,12 = base2,4,6.map((value) => value * scale);45console.log("scale=" + scale2);6console.log("adjusted=" + adjusted4,8,12.join(","));
    outputscale=2
adjusted=4,8,12

  1. scale ← 3, base ← 2,4,6, adjusted ← 6,12,18

    1const scale→ 3 = 3;2const base→ 2,4,6 = [2, 4, 6];3const adjusted→ 6,12,18 = base2,4,6.map((value) => value * scale);45console.log("scale=" + scale3);6console.log("adjusted=" + adjusted6,12,18.join(","));
    outputscale=3
adjusted=6,12,18

  1. scale ← 4, base ← 2,4,6, adjusted ← 8,16,24

    1const scale→ 4 = 4;2const base→ 2,4,6 = [2, 4, 6];3const adjusted→ 8,16,24 = base2,4,6.map((value) => value * scale);45console.log("scale=" + scale4);6console.log("adjusted=" + adjusted8,16,24.join(","));
    outputscale=4
adjusted=8,16,24

Follow Each Element

  1. Start with base: [2, 4, 6].
  2. map calls the callback once for each value.
  3. Each callback result goes into the new adjusted array.
  4. The original base array stays unchanged. | Input value | Callback result | | --- | --- | | 2 | 2 * scale | | 4 | 4 * scale | | 6 | 6 * scale |

Exercise: map_transform.js

Use map to multiply each number in an array by a scale value and print the new array