Splice vs slice in a function

Why does splice work as intended when I input the method above return?

function htmlColorNames(arr) {
  // Only change code below this line

  // Only change code above this line
  return arr;
}

But I I can’t put arr.slice(n1, n2) in the same line?
And curiously enough, if I put splice in return arr, it works as if it is slice.

https://tc39.es/ecma262/multipage/indexed-collections.html#sec-array.prototype.slice

https://tc39.es/ecma262/multipage/indexed-collections.html#sec-array.prototype.splice

Well gee thanks, those pages are literally on my second screen right now.

My first intention was to actually write something by myself, but then I figured that it would be me re-writing info from docs

1 Like

Andrey was trying to help…

Do you want someone to provide additional insight?

The biggest difference between slice and splice are whether or not they change the array. That means they have to be used differently.
You could certainly use either one in a solution, but you would use them differently because they are different functions.

If you show us the ways that you’ve tried to use slice and splice and describe what problem you having, we can help you troubleshoot. If you only ask why you can’t use them the same way we’re going to start by sharing documentation with you.

Alright, here’s what I feel unconfirmed about.

when I use splice at different line, the console shows different outcome.

function htmlColorNames(arr) {
  // Only change code below this line
arr.splice(1,3)
  // Only change code above this line
  return arr;
}
console.log(forecast(['cold', 'rainy', 'warm', 'sunny', 'cool', 'thunderstorms']));

Here it would return: [ ‘DarkGoldenRod’, ‘FireBrick’ ] as intended.

On another hand if I make the function return as follows:

function htmlColorNames(arr) {
  // Only change code below this line

  // Only change code above this line
  return arr.splice(1,3);
}

The console would show: [ ‘WhiteSmoke’, ‘LavenderBlush’, ‘PaleTurquoise’ ].
So for a splice, what I understand is
arr.splice(1,3) → return arr means that I have removed index 1 element and removed other 3 counting from the start in that original arr variable.

On the other hand,
return arr.splice(1,3) means that I show what splice has been removed in that splice(1,3) from the original array.

But since slice() doesn’t change anything from the original array,

function forecast(arr) {
  // Only change code below this line
arr.slice(1,3)
  return arr;
}

The slice here doesn’t affect or alter the original content in arr variable. When I tell the function to return arr, that’s why nothing change.

To see what slice has extracted from the original arr, it has to be told what slice extracted in return is this correct?

function forecast(arr) {
  // Only change code below this line

  return arr.slice(1,3);
}

see return value and understand the difference with action on the original array.

1 Like

run this:

const arr = [1, 2, 3]

console.log('arr before mutation ', arr)

console.log('mutating and and at the same time showing returning value of splice method below')

console.log(arr.splice(1, 1))

console.log('arr after mutation ', arr)
1 Like

yes. and?
returned value of splice. then arr result.
so?
or that wasn’t a question?

Oh, did I reply to you? I was trying to answer to the topicstarter.

Sorry about that, if that’s the case

I was basically just providing example to show difference between array after splicing AND returning value of splice().

Looks like questions were about that

oh, sorry, i’m confused

it’s all good, no worries

1 Like

That’s perfect. Thanks. I ran some test with slice as well. It basically confirms what I think it was.

Thankyou.

1 Like