Let’s read this article to know how to get the difference between two arrays in TypeScript. It will give you the simplest way to do it: you can use filter() combined with includes() method.
Get the difference between two arrays in TypeScript
Object or array is a reference type, which means we cannot compare two arrays like with primitive type. So, to get the difference between two arrays, we will need to get each element in one array and check if it includes another. So we will need to combine two methods: filter() with includes().
Combine filter() with includes() method
The logic here is we will use the filter() method to loop over one array then with each element, and use the includes() method to check if that element is inside another array. If not, it will be a different element, and the filter will return it inside an array.
filter() method
The filter() method will help you return an array of elements that pass the condition in the origin array.
Syntax:
array.filter((callback(currValue, index,array))
Parameters:
- callback: The block code that will be executed every time loop over an element.
- currValue: The current element in the current loop.
- index: The index of the current element.
- array: The array of the current element.
includes() method
The includes() method will help you to check if an element is inside a value. The value return is a boolean-type value.
Syntax:
array.includes(element, index)
Parameters:
- element: The element you want to search for is inside the array.
- index: The index of the start position you want to start searching.
Code example
Sample 1: Get the elements in array1 but not in array2
Example code
const array1 = [1, 2, 3, 4, 5, 6, 7,8,9,10]
const array2 = [1,2,4, 10, 13, 24, 56, 100]
// Get all element in array1 that not include in array2
const differenceArray = array1.filter((ele)=>{
return !array2.includes(ele)
})
console.log("Elements in array1 but not in array2 are ", differenceArray)Output:
[LOG]: Elements in array1 but not in array2 are [ 3, 5, 6, 7, 8, 9 ]Sample 2: Get the difference between two arrays
To get the difference between two arrays, we will follow the following steps:
- Get the elements in array1 but not in array2
- Get the element in array2 but not in array1
- Combine the elements of (1) and (2)
Here is the full example code to complete our practice.
Full example code
const array1 = [1, 2, 3, 4, 5, 6, 7,8,9,10]
const array2 = [1,2,4, 10, 13, 24, 56, 100]
// Get all element in array1 that not include in array2
const differenceArray1 = array1.filter((ele)=>{
return !array2.includes(ele)
})
console.log("Elements in array1 but not in array2 are ", differenceArray1)
// Get all element in array2 that not include in array1
const differenceArray2 = array2.filter((ele)=>{
return !array1.includes(ele)
})
console.log("Elements in array2 but not in array1 are ", differenceArray2)
// Combine both values is the difference between two arrays and is the result
const result = differenceArray1.concat(differenceArray2)
console.log("Difference between two arrays are ", result)Output:
[LOG]: Elements in array1 but not in array2 are [ 3, 5, 6, 7, 8, 9 ]
[LOG]: Elements in array2 but not in array1 are [ 13, 24, 56, 100 ]
[LOG]: Difference between two arrays are [ 3, 5, 6, 7, 8, 9, 13, 24, 56, 100 ]Summary
In this article, I showed you how to get the difference between two arrays in TypeScript. You can check if each element in one array exists inside another array and then get all elements that don’t exist in both.
Maybe you are interested:
- How to get the sum of an Array of Numbers in Typescript
- Array.find() possibly undefined in TypeScript
Full Name: Ly
Job: Editor
Major: IT
Programming Languages: Python, C, HTML, MySQL, SQL Server, C#, C++, Javascript, CSS, …