Open In App

How to replace an item from an array in JavaScript ?

Improve
Improve
Improve
Like Article
Like
Save Article
Save
Share
Report issue
Report

JavaScript array is an object that represents a collection of similar types of elements. In this article, we will learn how to replace an item from an array in JavaScript.

Method 1: Using Array Indexing

In this method, we will use the array indexing and assignment operator to replace an item from an array.

Example: In this example, we have used array Indexing to replace items in the array.

Javascript




let array = [1, 2, 3, 4, 5];
const index = 2;
const newValue = 10;
array[index] = newValue;
console.log(array);


Output

[ 1, 2, 10, 4, 5 ]

Method 2: Using the splice() Method

The array type in JavaScript provides us with the splice() method that helps us in order to replace the items of an existing array by removing and inserting new elements at the required/desired index. 

Syntax:

Array.splice(start_index, delete_count, value1, value2, value3, ...)

Note: Splice() method deletes zero or more elements of an array starting with including the start_index element and replaces those elements with zero or more elements specified in the argument list.

Approach:

  • Array list is initialized with months.
  • Using splice(1, 0, "February") to add “February” at index 1.
  • Resulting array: ["January", "February", "March", "April", "June"].
  • Using splice(4, 1, "May") to replace “June” with “May” at index 4.
  • Final array: ["January", "February", "March", "April", "May"].
  • The modified array is logged to the console.

Example: Below are some example to illustrate the Splice() method:

Javascript




function element_replace() {
 
    // Initializing the array
    const list = ["January",
        "March",
        "April",
        "June"];
 
    // splicing the array elements using splice() method
    list.splice(1, 0, "February");
    // expected output [January, February, March, April, June]
 
    // splicing the output elements after the first splicing
    list.splice(4, 1, "May");
 
    console.log(list);
}
element_replace();


Output

[ 'January', 'February', 'March', 'April', 'May' ]

Method 3: Using array map() and filter() Methods

Syntax:

ele[ele.map((x, i) => [i, x]).filter(x => x[1] == old_value)[0][0]] = new_value

Approach:

  • The code initializes an array ele with values [10, 20, 300, 40, 50].
  • It finds the index of the first occurrence of the value 300 in the array.
  • The value at the found index is replaced with 30.
  • The modified array is logged to the console.

Example: Below are some example to illustrate the Splice() method:

Javascript




function element_replace() {
 
    const ele = Array(10, 20, 300, 40, 50);
 
    ele[ele.map((x, i) => [i, x]).filter(
        x => x[1] == 300)[0][0]] = 30
 
    console.log(ele);
}
element_replace();


Output

[ 10, 20, 30, 40, 50 ]

JavaScript is best known for web page development but it is also used in a variety of non-browser environments. You can learn JavaScript from the ground up by following this JavaScript Tutorial and JavaScript Examples.



Last Updated : 04 Dec, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads