Understanding MDN web docs JavaScript Syntax

Venus Ang
2 min readDec 11, 2019

--

As much as I appreciate and rely on the MDN web docs, sometimes the explanations are a little cryptic or confusing, specifically their Syntax formulas. I found this particularly confusing when reviewing the documentation for the Array.prototype.reduce() method.

The MDN web docs explain Array.prototype.reduce() in a couple of ways with words, which is great. But what if you need a quick reference for the reduce method? Take a look at the Syntax the MDN web docs provides for reduce() in it’s raw form:

Reference link: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce

Okay. So I get some of that. I get that arr is an array and that .reduce() is the method. But what about some of the “stuff” inside the .reduce() method?

MDN web docs Syntax for Array.prototype.reduce(). What does it all mean?

What is this strange notation? In words I call it “bracket, comma, parameter name, bracket”. But um what does it mean?

The MDN web docs uses this “bracket, comma, parameter name, bracket” notation, such as [, initialValue] to convey when a parameter is optional. So, for example, with the reduce() method shown above, the following parameters are optional:

[, index]
[, array]
[, initialValue]

Another thing to notice — here MDN groups the two optional parameters within the callback using bracket notation like so: [, index[, array]].

Aside: checkout this article explaining the difference between parameters and arguments in JavaScript.

Examples

Let me show you a better example of the Syntax next to an actual example shown in the MDN web docs to help you understand this a little better.

In this example, the optional reduce() parameters [, index[, array]] are provided as currentIndex and array arguments, respectively:

Reference link: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce

Here is another example of the reduce() method but this time the
[, initialValue] parameter is provided as an argument of 10:

Reference link: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce

I hope this helps someone else!

--

--