A view from behind a waterfall falling into a green valley

In addition to the basic methods for JavaScript arrays there are some new, powerful techniques for modifying array content. Like push, pop, shift and unshift, these methods are referred to as mutators, due to the fact that they modify the array. In this article, I’ll cover two: fill and reverse.

fill

“Zeroes out” an array with any replacement value. Given an array of scores:

var scores = [15, 22, 3, 7, 11];

“Wiping out” every record in the array and viewing the result in the console:

scores.fill(0);
> [0, 0, 0, 0, 0]

fill can take two other arguments: the first, start is the point from which the fill will take place. Taking the current state of scores, we can fill from the third value with:

scores.fill(4,2);

The result:

> [0, 0, 4, 4, 4]

fill can also take an end value, where the fill stops. Of course, the fill “insert” value can be anything you wish: a number, string, or null, for example.

fill is part of ES6 / JS 2015, and is therefore supported in all recent browser versions except for IE and Opera; Mozilla Developer Network suggests a polyfill for those and older browser versions.

reverse

Pretty straightforward: reverse reverses the order of elements. Given an array molluscs:

var molluscs = ["oysters", "mussels", "limpets"];

Reversing the array and showing the results in the console:

molluscs.reverse()
> ["limpets", "mussels", "oysters"]

Photograph by Risto Kuulasmaa, used under a Creative Commons Attribution-NonCommercial 2.0 Generic license.

Enjoy this piece? I invite you to follow me at twitter.com/dudleystorey to learn more.