Adding elements to an array is required when the items to be added are dynamic, may be they are received from the server or an http request to a URL or as an input from the user.
splicemethod takes following arguments
- Index: Index at which the new element should be added. Starts at 0. If this index is greater than the length of the array, then the item will be added to the end of array.
- Number of items: This argument is used only while removing elements from the array. For adding objects to the array, it should always be 0.
- Value: This argument is the value to be added to the array.
splice can also be used to remove element from array. To learn different methods of removing array elements, refer this article.
let arr = [1, 2, 3, 4, 5] // add -1 to third place in the array arr.splice(2, 0, -1); console.log(arr);
Above code prints
splice function can also be used to add multiple values to the array. Any values given after the second argument are treated as the items to be added to array. Thus, below code will add -1, -2 and ‘splice demo’ to the array.
pushfunction takes the item to be added to the array as argument. Example,
let arr = [1, 2, 3, 4, 5] // add -1 to end of array arr.push(-1);
Method 3: Using unshift function
unshift function takes a value as argument inserts it to the start of the array and shifts all the elements one position to the right. Thus, the item is added at the beginning of the array. Example,
let arr = [1, 2, 3, 4, 5] // add -1 to start of array arr.unshift(-1); console.log(arr);
Above code prints the array as
This method adds a complete array to another array and could be used if more than one objects are to be added to the array.
When an array is added to other array, then all the objects of the added array are inserted into the original array.
concatfunction is used to adding arrays.
It is invoked on the array to which another array will be added. This method accepts the array to be added as argument.
Note that this method does not modify the original array but instead returns a new array which contains all the elements of both the arrays. Example,
let arr = [1, 2, 3, 4, 5] // add -1 to third place in the array let newarr = ['codippa', 6, 7]; // add array to another array let added = arr.concat(newarr); // print the new array console.log(added); // print original array console.log(arr);
Output of above code is
1, 2, 3, 4, 5, ‘codippa’, 6, 7
1, 2, 3, 4, 5
Look, the original array remains unchanged.
Method 5: Using index
This method can also be used to append value to an array or add item to the end of the array. Syntax for using this method is
array[index] = value
Note that the index should be equal to the size of array else an existing array element will be overwritten with the new value. Example,
let arr = [1, 2, 3, 4, 5] // append item to array arr = 'codippa'; // print array console.log(arr); // existing index of 3rd element arr = 0; // again print array console.log(arr);
Above example adds an object at 5th index, that is, size of the array. This means that the index of new element is 1 more than the index of last element of the array. It also adds an element at index 2 which belongs to the third array element. Output is
1, 2, 3, 4, 5, ‘codippa’
1, 2, 0, 4, 5, ‘codippa’
Notice that third element(at index 2) is replaced with the newly added value.
All the examples in this article initialize the array using
let keyword. This is a new keyword introduced in ECMAScript6 or ES6.
Earlier, a variable was initialized using
var keyword and that is the reason, you will find
var at most places. To know the difference between the two, refer this post.
Hope you liked this post. If yes, then do click the clap button below.0