Contents
In this post we will look at how to combine two arrays in JavaScript. We will also look at how to remove duplicates from an array using JavaScript.
Checkout this video:
Arrays
In this tutorial, we’ll learn how to combine two arrays in JavaScript. We’ll look at two methods: the concat() method and the spread operator. Both methods can be used to combine two arrays into one.
What are arrays?
In JavaScript, an array is a special type of object that stores a collection of values. Arrays are similar to standard objects, which store values as key-value pairs. However, arrays use numerical keys instead of string keys. This allows you to access each value in the array using its numerical index.
Arrays are a powerful tool for storing data, and they can be used in a variety of ways. For example, you can use them to store:
-A list of items (such as groceries or tasks)
-The contents of a file (such as the lines in a text file)
-The results of a database query (such as a list of users or products)
Arrays are also very efficient for certain operations, such as:
-Adding and removing items from the beginning or end of the array (known as “pushing” and “popping”)
-Accessing random items in the array (“random access”)
-Sorting the contents of the array
Creating arrays
There are several ways to create arrays in JavaScript. The most common way is to use the array literal notation, which looks like this:
var myArray = [ ];
You can also use the Array constructor to create arrays, like this:
var myArray = new Array( );
The difference between these two methods is that the array literal notation is easier to read and write, and it doesn’t require you to specify the size of the array. In contrast, the Array constructor requires you to specify the size of the array when you create it.
To create an array with elements already inside it, you can use this syntax:
var myArray = [ 1, 2, 3];
Accessing array elements
Array elements are accessed using their index number.
All arrays start with an index of 0.
So, the first element in an array is referenced as arrayName[0], the second element as arrayName[1], and so on.
let fruits = [“Banana”, “Orange”, “Apple”, “Mango”];
fruits[0]; // Banana
fruits[1]; // Orange
fruits[2]; // Apple
fruits[3]; // Mango
An invalid index -1, will return undefined:
fruits[-1]; // undefined
Array methods
There are several methods for adding and removing elements from an array.
Push – adds one or more elements to the end of an array and returns the new length.
Pop – removes the last element of an array and returns that element.
Shift – removes the first element of an array and returns that element.
Unshift – adds one or more elements to the beginning of an array and returns the new length.
Splice – adds or removes elements from an array.
Combining Arrays
JavaScript’s concat() method is used to merge two or more arrays. This method does not change the existing arrays, but rather returns a new array.
The concat() method
The concat() method is used to merge two or more arrays. This method does not change the existing arrays, but instead returns a new array.
Syntax:
array1.concat(array2, array3, …, arrayX)
Parameter Values:
array2,…,arrayX: Required. The arrays to be merged. Can be numbers, strings, booleans or objects
Example 1: Merging two arrays into one
In the following example we have two arrays with some common and some different values. When these two arrays are merged using the concat() method, both arrays are combined into one:
The spread operator
The easiest way to combine two arrays is to use the spread operator (…). The spread operator essentially takes an array and expands it into its individual values.
Let’s say we have two arrays:
const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
We can combine them like this:
const combined = […arr1, …arr2];
// [1, 2, 3, 4, 5, 6]
The Array.from() method
The Array.from() method creates a new Array instance from an array-like or iterable object.
Arguments
The Array.from() method has the following argument:
arrayLike: an array-like or iterable object to convert to an array.
Note: If you want to convert an array-like object Some methods can take in arrays as arguments, but how can we turn objects like sets and maps into arrays so that we can pass them as arguments? The built-in method Array.from does just that:
const set1 = new Set([1, 2, 3, 4, 5]);
console.log(Array.from(set1)); // [ 1, 2, 3, 4, 5 ]
const map1 = new Map([[1,’one’], [2,’two’], [3,’three’]]);
console.log(Array.from(map1)); // [ [ 1, ‘one’ ], [ 2, ‘two’ ], [ 3, ‘three’ ] ]
