Why wouldn't this solution work?

JavaScript
#1

Hi, after looking into splice and slice it seems this should work but it’s not. The hint is also asking to splice and loop, but I’m not sure why i’d need to use slice to “create a copy of the second array inside of function” etc.

Your code so far


function frankenSplice(arr1, arr2, n) {
return arr2.splice(n, 0, arr1); // start at index n,  doesn't delete anything, pushes in arr1
}

console.log(frankenSplice([1, 2, 3], [4, 5], 1)); 

// copy arr1 to arr2 in order starting at index of n 
// return result of the above
// slice = which indexes to delete (1,3) = 2
// splice = remove/replace and or add new element (index, how many to delete, new element)

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.146 Safari/537.36.

Challenge: Slice and Splice

Link to the challenge:

#2

First issue, per the instructions:

The input arrays should remain the same after the function runs.

From the MDN for Array.splice:

The splice() method changes the contents of an array by removing or replacing existing elements and/or adding new elements in place.

Do you see why you can’t do:

return arr2.splice(...)

Second issue, look closely at the MDN documentation to see what the argument values are for splice. Your third argument is not quite correct.

#3

Ok didn’t notice that. How come in this case this isn’t working either? Seems result is an empty array

function frankenSplice(arr1, arr2, n) {
  var newArr1 = arr1;
  var newArr2 = arr2;
  return newArr2.splice(n, 0, newArr1);
}

console.log(frankenSplice([1, 2, 3], [4, 5], 1));

Not sure how slice is needed to prevent original array from mutating. Also not sure how to use slice to reassign arrays

#4

That’s not quite how you make a copy of an array in JS. Search for ‘how to clone an array in JS’ to see how it is done.

I updated my original answer with the explanation as to why your call to splice is not working the way you want it to.

#5

Thank you. Looks like I’m running into a looping issue as it’s returning [ 4, 2, 2, 2, 5 ] what do you think is my mistake here?

function frankenSplice(arr1, arr2, n) {
  const newArr1 = [...arr1];
  const newArr2 = [...arr2];

  for (let i = 0; i < newArr1.length; i++) { // while i is less than length of arr1
    newArr2.splice(n, 0, newArr1[1]); // place arr1[0][1][2] into arr2 at index n without deleting anything
  }
  return newArr2;
}

console.log(frankenSplice([1, 2, 3], [4, 5], 1));

** edit just realized I place newArr1[1] vs newArr1[i] but now it’s returning [ 4, 3, 2, 1, 5 ] it should be [ 4, 1, 2, 3, 5 ] :sweat_smile:

#6

OK, I think you might have made things a little more complex than they need to be :slight_smile:

First, you are creating a good copy of arr2 now. You don’t need to create a copy of arr1 since you aren’t changing anything in that array.

I think you realized that splice can’t take an array as the third argument and so you are trying to add each element one at a time using the for loop. The documentation may not have been super clear, but splice can take more than three arguments. In fact, it can take an unlimited amount of arguments. Any arguments after the first two are values that will be spliced into the array. From the documentation:

let arrDeletedItems = arr.splice(start[, deleteCount[, item1[, item2[, ...]]]])

Forget that the square brackets are there for a moment (that just means they are optional arguments). So we have:

let arrDeletedItems = arr.splice(start, deleteCount, item1, item2, ...)

item1, item2, … will all be spliced into the array. So the key here is that you need to convert arr1 from an array to a list of values that can be passed into splice. The good news is that you are already doing this, so you have an example of how to do it. Do you see where you are doing this already?

#7

The question is where am I converting arr1 from an array to a list of value?

If so, I believe it’s when I’m running the for loop here right

for (let i = 0; i < newArr1.length; i++) { // while i is less than arr1
    newArr2.splice(n, 0, newArr1[i]); // place arr1[0][1][2] into arr2 at index n without deleting anything

I thought it would run
newArr2.splice(n, 0, newArr1[0]) = newArr2.splice(n, 0, 1)
newArr2.splice(n, 0, newArr1[1]) = newArr2.splice(n, 0, 2)
newArr2.splice(n, 0, newArr1[2]) = newArr2.splice(n, 0, 3)

#8

It’s always adding the value at index n in the array, which is not what you want. If you want to keep doing this with a for loop then you will need to take that into account.

My advice, forget the for loop. You don’t need it. The key here is passing the correct arguments into splice.

#9

Ok I’ll give it a shoot. I used the “hints” here that said

Hint 2

Loop through all of the items in the first array. For each item in the first array splice it into the copied array in the index given as argument.

I actually don’t know what to do. Trying really hard not to look at the solution lol

#10

Let’s go back to your original solution:

function frankenSplice(arr1, arr2, n) {
  return arr2.splice(n, 0, arr1); 
}

You’ve already fixed the issue with cloning the array, so now you have:

function frankenSplice(arr1, arr2, n) {
  const newArr2 = [...arr2];
  return newArr2.splice(n, 0, arr1); 
}

As you’ve figure out, the third argument to splice can’t be an array, so passing arr1 here won’t work. I’ve tried to explain what it needs to be instead above. Reread what I wrote and see if you can figure it out.

That’s the only thing left to do. If you understand what this is doing:

const newArr2 = [...arr2];

Then you should be able to solve it. If you don’t understand what that is doing then you need to figure that out first.

#11

Regarding Hint 2: If you use that method then you will definitely need to use Hint 3 as well, which you weren’t doing.

#12

This clones an array, so I guess I need to do something else to turn it into a list?

#13

Wasn’t I using i++ ?

#14

Tried turning arr1 into a string not working

function frankenSplice(arr1, arr2, n) {
  var arrString = arr1.toString();
  const newArr2 = [...arr2];
  return newArr2.splice(n, 0, arrString); 
}
#15

Yes, at a high level it is “cloning” an array, but it isn’t using an operator that specifically does the cloning.

When you create an array, you can define it with several values as:

const array = [0, 1, 2, 3, 4];

Look at what is inside of the square brackets. Does that look like a list of numbers to you? Does that sound like what the splice method wants? Now look at how you are cloning the array:

const newArr2 = [...arr2];

So what do you think ...arr2 is doing? Remember, to define an array with multiple values you have to use a comma separated list.

#16

@bbsmooth Ok

Once we discussed I can’t use the array I cloned it or copied it based on these instructions . You are implying that it’s not right? …arr2 = 4,5 based on my understanding.

I don’t understand and I know you’re trying to hint at something, but I’m not making any progress here.

if arr1 can’t be a array then I tried making it a string

function frankenSplice(arr1, arr2, n) {
  var arrString = arr1.toString();
  const newArr2 = [...arr2];
  return newArr2.splice(n, 0, arrString); 
}

Can we ignore previous comments and just re-explain what I need to do? (the above repsonses are just confusing me at this point maybe)

#17

Converting arr1 to a string won’t do it. You aren’t trying to splice a string into the array, you are trying to splice all of the numbers in arr1. So you can get rid of that first line.

You are now back to:

function frankenSplice(arr1, arr2, n) {
  const newArr2 = [...arr2];
  return newArr2.splice(n, 0, ?); 
}

I put a question mark at the end where the only remaining issue is. We know you can’t just put arr1 there because that is an array and splice doesn’t take an array as an argument. What it does take is a bunch of values separated by commas, for example:

return newArr2.splice(n, 0, 5, 6, 7, 8);

This would splice the values 5, 6, 7, 8 into the array at index n. So what you need to do is convert arr1 into a list of separate values like that. I’ve pointed out that you are already doing this when cloning arr2, so you have an example of how to do it. The cloning method you are using is using the spread operator.

You’re right, I am giving you every hint I can think of without just giving you the answer. You are very close. Once you understand what the spread operator is doing when you are cloning arr2 then I think you will understand what you need to do for the third argument in splice.

#18

I’m already doing what I need to do to arr2? I would think that would be to make const newArr1 = [...arr1] then use newArr1 as third argument but it’s not.

Using console.log I know that […arr2] = [ 4, 5 ]
I still don’t know what to do

I’ve also tried using …arr1 as third argument

I just looked at the solution and saw I couldn’t use the return on the same line. I refuse to spend over 2hrs on a solution when I’m only missing 10% and I’m not making progress over a prolong time period

Thanks for your help though

#19

It’s right there in front of you :slight_smile: Remove the square brackets, you get:

...arr2 = 4,5

So if you had ...arr2 as the last argument to splice it would be the same as:

newArr2.splice(n, 0, 4, 5);

So if you want to pass a comma delimited list of values of arr1 into splice instead, how would you do that?

Also, I forgot to mention one last thing. You can’t have the splice method on the same line as the return because splice returns an array of element removed (or an empty array if none were removed). So you need to do the splice method first on its own line and then return newArr; on its own line.

#20

Yeah but it wasn’t working even though earlier I tried …arr1 because as you said the return method. So I had two issues at the same time unfortunately.

The last few problems my issue has been something like this where I’m not aware of a rule (ie can’t use array as third argument, or can’t return on splice). How would I find this for the future? My understanding is that memorization is not a big element in coding so I presume I shouldn’t have to memorize these rules