Generate Arrays from Args, Random, and Higher-Order Inputs
Three array-generation idioms that come up constantly: building a fixed-length array of computed values (random fillers, ranges, defaults), turning function arguments into an array, and writing higher-order functions that return array transformers parameterized by a constant. Each is one line of code, but the patterns generalize to test fixtures, configuration, and small DSLs.
311 views
8
// 5 random floats in [0, 1).
const randoms5 = Array.from({ length: 5 }, () => Math.random());
console.log(randoms5);
// [0.x, 0.y, 0.z, 0.w, 0.v] (5 unique floats)
// 5 random integers in [0, 99].
const randomInts = Array.from({ length: 5 }, () => Math.floor(Math.random() * 100));
console.log(randomInts);
// [42, 7, 88, 13, 55] (example output)
// The mapping function receives (_, i), so you can build index-based values.
const squares = Array.from({ length: 5 }, (_, i) => i * i);
console.log(squares); // [0, 1, 4, 9, 16]
// Same idea with a fixed default value.
const zeros = new Array(5).fill(0);
console.log(zeros); // [0, 0, 0, 0, 0]Array.from({ length: n }, fn) is the cleanest way to produce a fixed-length array. The first argument is an array-like with a length, the second is a mapping function called once per slot with (value, index). Use it for random fillers, index-based sequences (i => i * i), or any computed default. For a constant value, new Array(n).fill(value) is shorter, but be careful: passing an OBJECT to fill shares the same reference across every slot, so new Array(3).fill({})[0] === new Array(3).fill({})[1] is true for the same call. Use Array.from({ length: n }, () => ({})) to get fresh objects per slot.
// Rest parameter packs all extra args into a real array.
const toArray = (...args) => args;
console.log(toArray(1, 'two', { three: 3 }));
// [1, 'two', { three: 3 }]
// Array.of is the variadic factory cousin to Array.from.
console.log(Array.of(1, 2, 3)); // [1, 2, 3]
// Why does Array.of exist? Because new Array(n) treats a single number as a length:
console.log(new Array(3)); // [ <3 empty items> ]
console.log(Array.of(3)); // [3]
// Combine rest params with a transform.
const sumOf = (...args) => args.reduce((a, b) => a + b, 0);
console.log(sumOf(1, 2, 3, 4)); // 10Rest parameters (...args) are the modern way to collect call arguments into a real array; arguments (the legacy object) is array-like, not an array, and arrow functions do not even bind it. Use rest parameters in any new code so you get .map, .filter, etc. for free. Array.of(...) is a small but useful sibling of Array.from: it always treats every argument as a value, so Array.of(3) is [3], while new Array(3) is a sparse length-3 array. Reach for Array.of when you might pass a single number and want it as a value rather than as a length.
// Closure captures n, returns a function that applies it.
const addN = (n) => (arr) => arr.map((x) => x + n);
const mulN = (n) => (arr) => arr.map((x) => x * n);
const clampN = (max) => (arr) => arr.map((x) => Math.min(x, max));
console.log(addN(10)([1, 2, 3])); // [11, 12, 13]
console.log(mulN(3)([1, 2, 4])); // [3, 6, 12]
console.log(clampN(5)([2, 4, 8, 16])); // [2, 4, 5, 5]
// They compose: pass the result of one as an input to the next.
const add10 = addN(10);
const times3 = mulN(3);
console.log(times3(add10([1, 2, 3]))); // [33, 36, 39]
// Or build a pipeline helper.
const pipe = (...fns) => (input) => fns.reduce((acc, fn) => fn(acc), input);
const pipeline = pipe(addN(10), mulN(3), clampN(40));
console.log(pipeline([1, 2, 3, 4])); // [33, 36, 39, 40]Returning a function from a function is the simplest form of currying and the everyday shape of higher-order programming in JavaScript. addN(10) does no work itself; it returns an array transformer that adds 10 to each item. The transformers compose: feed one's output into the next, or wrap them in a pipe helper that walks them left-to-right. This pattern is the same one Lodash uses for _.curry and Ramda uses pervasively, and it keeps array transformations declarative without giving up the standard .map/.filter/.reduce toolkit.