ES6 - Use Destructuring Assignment to Assign Variables from Arrays

JavaScript
1

Tell us what’s happening:

I’ve looked at the solution and I just don’t get it. How do a & b just appear inside the array? Why isn’t it pushed into the it?

I’ve looked over the lesson numerous times and can’t see anything about it, so am really struggling to work out how this works

Can anyone help?

Thanks

Your code so far

let a = 8, b = 6;
// Only change code below this line
//don't want to spoil as I've already looked at solution, I just don't understand it

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/122.0.0.0 Safari/537.36

Challenge Information:

ES6 - Use Destructuring Assignment to Assign Variables from Arrays

2

The syntax of the language allows you to use the square brackets to represent a group operation assignment. It not that the variable names are converted to an array.

3

Thanks for the explanation. I don’t think I’ve seen that in the lessons, previously, so is this an advanced technique or just a common thing and I’ve missed it?

I’ve tried to google what it is (group operation assignment?) and haven’t come up with much. Could you explain it to me as I’m not sure what it is or how it works?

4

In that lesson it makes mention to two terms: spread operator and array destructuring. That’s what you might want to search for.
Here’s one about the spread operator
Here’s one about destructuring
I am going to let those links give you some examples.

By the way, these are features that the language has that can be catalogued as syntactic sugar, meaning: it supposedly allows the user of the language to do operations that are common enough but that it would take more steps to do other wise.

5

In javaScript, the "Destructing" technique lets you extract information from an array or an object and assign it to any variable you want easily.

for example, if you have an array and want to assign its first values to another two separate variables, you can use the array index like this:

let a, b;
let arr = [6, 2, 3, 5];

a = arr[0];
b = arr[1];

console.log(a, b);       // output: 6 2

Then in ES6 you can do the same but in one line using Destructing:

let a, b;
let arr = [6, 2, 3, 5];
[a, b] = arr;

console.log(a, b)        // output: 6 2

Here, this is Array Destructing you have an array on the right-hand side and another array on the left-hand side, what JavaScript will do is that it will take the first value in the right-hand side array and assign it to the first variable in the left-hand side array ( the same for b variable).

As mentioned in the lesson, if you want to get a specific value in the array, you can use commas until you reach the value you want to get ( to destruct ).

Back to your case, you need to swap a and b values, so you can use the array destructing way to do it in one line,

assume that
a is 8
b is 10

so, you will make an array on the right-hand side using those values in order like [8, 10] or [a, b], and on the left-hand side make an array with the variables names but reversed like [b, a].

[b, a] = [a, b];

That way, if you followed how destructing works, you will see that b is now 8 and a is now 10.

sorry my super long answer.

6

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.