Declaring variables using an array [duplicate]

Question

I came across this code in JS Novice to Ninja.

const form = document.getElementsByTagname('form')[0];

const [input,button] = form.elements;

this create a const called input mapped to the value of the form[0] and another const called button mapped to form[1]

is this:

 const [input,button] = form.elements;

the same as:

const input = form.elements[0];
const button = form.elements[1];

Is that just some shorthand I've never come across? If so can someone tell me what it's called? Or am I misunderstanding what is happening here.

It's called destructuring, in this case destructuring assignment. The syntax on the left matches the structure of the object on the right. — Pointy
– Pointy, Commented Apr 22, 2018 at 2:59
What does this symbol mean in JavaScript?, Expressions and operators. — Sebastian Simon
– Sebastian Simon, Commented Apr 22, 2018 at 3:29

CodyKnapp · Accepted Answer · 2018-04-22 03:10:14Z

1

const [input,button] = form.elements;

would actually be the same as

const input = form.elements[0];
const button = form.elements[1];

This is called destructuring and it can also be used for objects.

const {value} = someObject; would be the same as const value = someObject.value;

answered Apr 22, 2018 at 3:10

CodyKnapp

1095 bronze badges

Sign up to request clarification or add additional context in comments.

1 Answer 1