Destructuring on list should be used

JavaScript
1

Hey guys, I am having trouble completing the assignment. Haven’t I used destructor on list? by having [a,b,...list] = source ? Thanks

   **Your code so far**


const source = [1,2,3,4,5,6,7,8,9,10];
function removeFirstTwo(list) {
 // Only change code below this line
let a, b;
[a, b,...list] = source;
 const arr = list; // Change this line
 // Only change code above this line
 return arr;
}
const arr = removeFirstTwo(source);

   **Your browser information:**

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

Challenge: Use Destructuring Assignment with the Rest Parameter to Reassign Array Elements

Link to the challenge:

2

The default code has the following line:

// Only change code below this line
const arr = list; // Change this line
// Only change code above this line

This means that you should not add new lines of code but only change this one line.

Look at the example assignment in the instructions. Do you see how that is done all on one line. That is a big hint as to how to solve this challenge.

3

Okay I somehow did it, the idea just popped into my head, basically it’s the same just using list.

4

You’re right, it is basically the same thing as the example. But the point is to not necessarily solve the challenge by copying the example but rather to understand what the code is doing. So make sure you understand what is going on here.

5

we call the function use source as the parameter and placing the array that we have.
inside the function we compare it to the functions parameter, and it changes depends on the input. so the function always cuts the first two, according to the given array.

6

Ahh, I didn’t mean understand how the entire function works, I meant understand how destructuring works.

7

Yeah I think so, I’ll write it in simple language.
basically it includes everything else if I have a,b, syntax before it will cut a,b and include what’s left.

The only thing I am a bit confused isn’t the rest parameter makes an array itself?

const [a,b,...array] = list

so shouldn’t it be an array inside an array or this is just how the syntax works.

edit: so yeah array is a sub array of list or source if we take a look at the lesson.

8

Don’t think of the left hand side as an array. It does look like an array because you are using square brackets, but the left hand side isn’t actually creating an array, it’s just the syntax used for destructuring arrays.

Let’s say we just wanted to get just the first value from the list array using destructuring:

const [first] = list

The variable first will be set to the first number in the list. Having the square brackets around it on the left hand side does not make it an array.

Now let’s make a copy of the list using destructuring:

const [...copy] = list

The variable copy will be a copy of the list array because the rest parameter inside of the destructuring tells JS to gather all of the remaining elements in list (which happens to be all of them in this case) and create a new array with them, which is then assigned to copy. There is no need for extra square brackets anywhere to denote that copy is an array (in fact, putting an extra set of square brackets around copy would be an error and your JS would break at that point).

9

I meant it’s an array in an array (sub array) because the rest parameter creates an array, is that correct?

edit: re reading your last sentence again, I think got my answer!

10

Yeah, the notation can be a little confusing. As bbsmooth is saying, that is not an array because it has square brackets ([ and ]), because of where it is in the syntax, JS knows that this is array destructuring. It is saying, “take the first value in that array and store it in a, store the second element in b, and then scoop up the rest, put it all in an array and store it in array”.

I meant it’s an array in an array (sub array) because the rest parameter creates an array, is that correct?

I don’t understand.

This is what is happening:

const myArr = [1, 2, 3, 4, 5]
const [first, second, ...theRest] = myArr

console.log(first)
// 1
console.log(second)
// 2
console.log(theRest)
// [3,4,5]
11

(theRest) = [3,4,5]
because " he rest parameter syntax allows a function to accept an indefinite number of arguments as an array"
is that correct?
hence array in an array. ( from the lesson )
I think that’s it from the answers I got here and from the definition itself.

12

An “array in an array” is a multi-dimensional array, which is definitely not the case here. So I think perhaps you are not using the correct terms for what you are trying to ask. Do you mean that the rest parameter is creating a new “subarray” from the original array because it is being used in a destructuring assignment? Yes, that is what is happening, but I would not call it an “array in an array” because that really means something completely different.

1 Like
13

And this application is not in a function, not in a parameter list. This is the destructuring and the rest operator in a variable declaration, not a parameter list.

14

yet doesn’t the rest operator (…var) creates a variable on its own?

15

Not necessarily:

const myArr = [1, 2, 3, 4, 5]
let first, second, theRest
[first, second, ...theRest] = myArr

console.log(first)
// 1
console.log(second)
// 2
console.log(theRest)
// [3,4,5]

It depends on how you use it. When you do, it is part of the initialization of the variable, not the declaration.

The only place where it would always create a variable would be in a parameter list of a function. But none of the above examples show a rest operator being used in a function parameter list.

16

I got confused myself lol I mean instead of variable an array*

so the question is doesn’t rest operator always create an array*

17

Yes, the value stored by the rest operator into a variable will always be an array, even if there is nothing:

const myArr = [1, 2]
let first, second, theRest
[first, second, ...theRest] = myArr

console.log(first)
// 1
console.log(second)
// 2
console.log(theRest)
// []
1 Like
18

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