This tutorial shows you three ways of appending new items to the end of an existing array.
Node.js Series Overview
- String Replace All Appearances
- How to Run an Asynchronous Function in Array.map()
- How to Reset and Empty an Array
- for…of vs. for…in Loops
- Get an Array With Unique Values (Delete Duplicates)
- Callback and Promise Support in your Node.js Modules
- Run Async Functions/Promises in Sequence
- Run Async Functions/Promises in Parallel
- Run Async Functions in Batches
- Get a File’s Created Date
- Get a File’s Last Modified/Updated Date
- How to Create an Empty File
- Check If a Path or File Exists
- How to Rename a File
- Check If a Path Is a Directory
- Check If a Path Is a File
- Retrieve the Path to the User’s Home Directory
- How to Touch a File
- Read File Content as String
- Check If a Directory Is Empty
Array#push method allowing you to push one or more items to the end of the array. You may also append new items by creating a new array using the spread operator to push existing items to the beginning. Another way is the concatenation of arrays creating a new one.
Let’s explore all options in the paragraphs below.
Push Items Into an Existing Array
Array#push method appends one or more items to the end of the array.
Array#push changes the values of the array, but doesn’t return the array with the newly added items. It returns the new array length:
const ids = [1, 2, 3] const newArrayLength = ids.push(4) // 4 // the value of "ids" is [1, 2, 3, 4] // or push multiple values ids.push(5, 6, 7) // the value of "ids" is [1, 2, 3, 4, 5, 6, 7]
Spread and Append Items Into a New Array
You can also create a new array containing existing and new items. Create a new array and use the spread operator to add all items of an existing array to the beginning of the new array. Then, add all new items at the end:
const ids = [1, 2, 3] const newIds = [...ids, 4] // [1, 2, 3, 4] const newIds = [...ids, 4, 5, 6] // [1, 2, 3, 4, 5, 6]
Concat(enate) Items to an Array
Another idea is to concatenate existing and new items to a new array. Here you must concatenate new items onto the existing array. That keeps the order of appending new items to the end:
const ids = [1, 2, 3] const newIds = ids.concat(4, 5, 6) // the value of "newIds" is [1, 2, 3, 4, 5, 6]
What Should You Use?
Well, use what you like best!
Array#concat when building an array pipeline by chaining further operations, like
In situations where I only want to append the item without additional operations, I’m using the spread operator.