How does JavaScript array destructuring assign values to variables?

It matches by position. In const [name, score] = ["Mina", 92], name receives the first element, "Mina", and score receives the second, 92. The names you choose do not control which elements are selected; their positions in the pattern do. [S1]

The array on the right is the source. The bracketed pattern on the left describes which positions to bind to variables. You can use this with an existing array too:

const results = ["Mina", 92];
const [name, score] = results;

This creates bindings from the values. It does not remove the elements from results or change the array's shape. [S1]

Put an extra comma where you want to skip a position: const [first, , third] = values. The blank slot means “do not bind the second position.” For example, with const values = ["red", "green", "blue"], first is "red" and third is "blue". [S1]

The skipped position still counts. If you wrote const [first, third] = values, then third would receive "green", the second element—not the third. Use as many commas as needed to reach the position you want, and name the variable for the value it will actually receive.

Write the default after the variable name: const [label = "Untitled"] = values. JavaScript uses that default if the corresponding position produces undefined, including when the element is missing. It does not use the default for an explicit null. [S1]

For example:

const [missing = "fallback"] = [];
const [empty = "fallback"] = [undefined];
const [provided = "fallback"] = [null];

Here, missing and empty become "fallback"; provided remains null. The default applies to that position when its value is undefined or missing. If you need a fallback for null too, that requires a separate choice in your code.

Assume this array represents a task as [title, internalCode, owner, status]. You want the title, owner, and status, and you want a fallback when status is missing:

const task = ["Draft guide", "A17", "Lee"];
const [title, , owner, status = "Not set"] = task;

The result is title === "Draft guide", owner === "Lee", and status === "Not set". The second slot is skipped, so owner still comes from position three. The missing fourth value triggers the default. The original task array remains unchanged. [S1]

A useful check before writing the pattern is to number the source positions, then line up each desired variable with its position. Add a blank slot for every position you want to skip, and add a default only where an undefined value should have a fallback.