batman091716
batman091716

Reputation: 169

How do I make this function work as expected?

I tried to make a function which would copy the existing array sunsetColors, and change the first element to "blue".

Then my sunset function should return the copy of the array. Please help me to understand what I need to change to make it work as expected.

var sunsetColors = ["brown", "purple", "pink", "red", "orange", "yellow"]

What I am trying:

sunset = () => {
  return sunsetColors.splice(0, 1, 'blue');
}

Upvotes: 0

Views: 79

Answers (4)

Travis J
Travis J

Reputation: 82267

Splice will return

An array containing the deleted elements. If only one element is removed, an array of one element is returned. If no elements are removed, an empty array is returned. MDN - splice

So you would need to return the set, and not the result of the splice

var sunsetColors = ["brown", "purple", "pink", "red", "orange", "yellow"];
sunset = () => {
    sunsetColors.splice(0, 1, 'blue');
    return sunsetColors;
};
console.log(sunset());

That will make your function work "as expected" (in that it is now returning the modified array. However, "the splice() method changes the contents of an array by removing existing elements and/or adding new elements.". If its your intention to only modify a copy to use, then you should instead make a copy and then modify that one.

Using slice together with unshift is a good approach to use for this, @mahan alludes to this in their answer as well.

"The slice() method returns a shallow copy of a portion of an array", which will cover the copy aspect, and "the unshift() method adds one or more elements to the beginning of an array", which will cover the insertion.

It would look like this, still using your arrow function:

var sunsetColors = ["brown", "purple", "pink", "red", "orange", "yellow"];
sunset = () => {
    let arrayCopy = sunsetColors.slice(1);
    arrayCopy.unshift('blue');
    return arrayCopy;
};
console.log(sunset());

Upvotes: 4

mahan
mahan

Reputation: 14935

Use .slice() method to clone the array.

var sunsetColors = ["brown", "purple", "pink", "red", "orange", "yellow"]

function copySunsetColor(list, color) {
  var colorList = list.slice();
  // Add 'color' at the start of the list 
  colorList[0] = color
  return colorList;
}

console.log(copySunsetColor(sunsetColors, "blue"))

Use unshift to add an item at the start of a list.

var sunsetColors = ["brown", "purple", "pink", "red", "orange", "yellow"]

function copySunsetColor(list, color) {
  var colorList = list.slice();
  // Replace the first item of the list with 'color' input
  colorList.unshift(color)
  return colorList;
}

console.log(copySunsetColor(sunsetColors, "blue"))

Upvotes: 1

You could add you array to a new one containing blue.

sunset = ['blue'].concat(sunsetColors)

var sunsetColors = ["brown", "purple", "pink", "red", "orange", "yellow"]

sunset = ['blue'].concat(sunsetColors.slice(1))

console.log(sunset)

In case you need to change another value different from the first element, you could use some function like this:

f = (array, position, value) => { array[position] = value; return array }

var sunsetColors = ["brown", "purple", "pink", "red", "orange", "yellow"]

f = (array, position, value) => { array[position] = value; return array }
console.log(f(sunsetColors, 0, 'blue'))

Upvotes: 0

szczepaniakdominik
szczepaniakdominik

Reputation: 472

Try this solution. Firstly it creates a copy (not reference) of an array, then it replaces first element.

let sunsetColors = ["brown", "purple", "pink", "red", "orange", "yellow"];

copy = (array) => {
  let newArray = [...array];
  newArray[0] = 'blue';
  return newArray;
};

Upvotes: 0

Related Questions