The “TypeError: filter is not a function” in JavaScript is an error that you will often encounter in the process of programming in the JavaScript language. This article will teach you the cause and how to fix this error. Let’s check it out!
TypeError: filter is not a function in JavaScript
The filter() method creates and returns an array containing all the elements that are the output of a particular function.
The filter() method only works correctly when we call it on a value of array type. The error “TypeError: filter is not a function” will appear if one of the following cases occurs:
Reason 1: Call filter() method on non-array value
Example:
const num = {}; const myResult = num.filter(check); function check(num) { return num > 10; } console.log(myResult);
Output:
TypeError: num.filter is not a function
I use the check() function in the above code to check for elements more significant than 10 in the num variable. Then I use the filter() method to create an array containing those elements.
But the value of num is not an array type, so the output I get is the “TypeError: filter is not a function” error.
Solution 1: Only call the filter() method on the value of the type of array
To resolve the “TypeError: filter is not a function” error, what I need to do now is to make sure I only call the filter() method on the value of the type of array.
Code:
const num = [10, 40, 5, 7]; const myResult = num.filter(check); function check(num) { return num > 10; } console.log(myResult);
Output:
[ 40 ]
Reason 2: Call the filter() method on an object
In this example, I have an object called “users”. This object has two properties: id and name. I want to get the information of the user whose id is 2.
Example:
const users = { "1": { "id": 1, "name": "learnShareIT1" }, "2": { "id": 2, "name": "learnShareIT2" } }; const myResult = users.filter(user => user.id === 2); console.log(myResult);
Output:
TypeError: users.filter is not a function
Solution 2: Use the Object.values() method
Using the filter() method on an object may get the “TypeError: filter is not a function” error. To resolve the “TypeError: filter is not a function” error, in this case, we will use the Object.values() method before calling the filter() method on the “users” object.
Code:
const users = { "1": { "id": 1, "name": "learnShareIT1" }, "2": { "id": 2, "name": "learnShareIT2" } }; const myResult = Object.values(users).filter(user => user.id === 2); console.log(myResult);
Output:
[ { id: 2, name: 'learnShareIT2' } ]
The “TypeError: filter is not a function” error is gone, and the program has run correctly.
Summary
This article has explained what causes the error “TypeError: filter is not a function” in JavaScript and how to solve it. I hope the information in this article will be helpful to you. Thanks for your reading!
Maybe you are interested:
- TypeError: indexOf is not a function in JavaScript
- TypeError: querySelectorAll is not a function in JS
- TypeError: Cannot read property ‘top’ of Undefined in JS
- TypeError: Cannot read property ‘classList’ of Null in JS
Hello, my name’s Bruce Warren. You can call me Bruce. I’m interested in programming languages, so I am here to share my knowledge of programming languages with you, especially knowledge of C, C++, Java, JS, PHP.
Name of the university: KMA
Major: ATTT
Programming Languages: C, C++, Java, JS, PHP