Well our functionality works.
And of course we are returning array of arrays which is our patch United products array.
The problem might be that there are cases where you cannot use Splice.
You cannot mutate the original array.
So in this case we're gonna take a look at how we can set up the same functionality using these slice
method.
And then you can decide because again essentially please keep in mind we're going to return the same
array of arrays.
So our end result is not going to change just how we get there and what I'm gonna do right now is just
so you can have for your reference.
And I don't know what is your preference.
Maybe later you're going to use splice instead.
But I'm gonna stick with slice and I'm going to create the same thing I'm going to go with Khan's new
product.
And by the way there's gonna be quite a bit of repetition meaning we're still going to use array from
the length of number of pages and all that.
So we're gonna go with array from then we're passing our object.
Again we have like property and again we need to have number of pages and we also still have our map
method.
However in this case though I would want to access the index why.
While you're seeing a second.
And if I don't want the actual item which is my first argument I can just omit it by passing in the
underscore.
So I'm going to passing underscore and then I'm gonna say next.
So now maxing the index and if we're going to console log you're going to see that since I have four
items in the array.
Well what I'm going to have I'm going to 0 1 2 and 3 and of course right now we're just passing it on
defined and the way it's gonna work is we're gonna have the slice method instead of splice and again
the differences that splice mutates the original array when you run it but slice does not.
So we're going to return then products and then we have the slice.
Now for the slice it's a bit different.
Where for displays we have the starting point and then how many items we would want to remove.
In this case though if we're using slice we pass in again the starting point but then the second one
is the ending point.
Now what do we could use as an entry point.
Well we could say items per page correct or there's gonna be a problem where you're going to see that
we're going to have array of arrays but we're gonna be essentially copying the same value from the product
array.
So the first four items and you can clearly see that by checking out the first array which has the item
12 with an idea of 12 and then the same goes for this guy.
And then you can also see that because we have four items and the last one does have four items within
the array that already is a red flag where we can say OK how can we have 16 items if we have only 14
products because essentially we're just copying the same four items from the product array.
What would be the solution solution would be in using the index since remember index is gonna change
each and every time as we're iterating over our new alright that we're creating with a link property
and number of pages and the way we're going to set this up we're going to set cost then the name is
going to be stark.
That is going to be equal to a index multiplied by items per page.
So are multiplying this by items per page.
And now of course we would want to change the slices well where each and every iteration.
We're not going to start from the zero.
We're gonna go would start that is gonna be our starting position and then instead of just grabbing
items per page we're going to say start plus plus items per page and let's go forward what's happened.
So we have the index.
Initially it is going to be zero.
We're gonna have index zero multiplied by items page just for that is going to return zero of course.
Then we start with zero and then we go up to index of four.
So we grab those items so 0 1 2 3 grab 4 items.
Then next iteration index is gonna be already 1 multiplied by 4.
Our STARTING POSITION IS GONNA BE AT index of 4 and then our end position is gonna be start plus items
per page.
So we're gonna start at index 4 and and up to index 8.
And these are the items that we're gonna get.
And as you can see now in this case we have proper array of arrays where we only have the unique values.
And I can clearly see that by looking at first items this is going to be additive 12 and then this is
gonna be a D of a love.
And what you can also probably notice that we still get our product.
So unlike splice where we mutate original array.
In fact when we're using slice we're not doing that.
That's the reason why all the items are still shown.
Unlike previously when we used this plate again this is really up to you in this scenario doesn't really
matter which ever method you'd use.
But if there are cases where you cannot use splice you can definitely use lights.
But in this case scenario of course you can just common this out and then uncommon the previous one
if you like the syntax better.
Essentially we're doing the same thing we're turning array of arrays where repatriating our products
are right that we fetched from the API.