Support us .Net Basics C# SQL ASP.NET Aarvi MVC Slides C# Programs Subscribe Download

JavaScript array filter method

Suggested Videos
Part 19 - Arrays in javascript
Part 20 - JavaScript array push and pop methods
Part 21 - JavaScript array mutators



The filter() method creates a new array and populates that array with all the elements that meet the condition specified in a callback function.



Syntax : array.filter(callbackFunction[, thisArg])

Parameters :
callbackFunction Required. Function that gets called for each element of the array. If the function returns true, the element is kept otherwise filtered.
thisArg Optional. An object to which the this keyword can refer in the callbackfn function.

The filter method calls the callbackfn function one time for each element in the array. If the callback function returns false for all elements of the array, the length of the new array that will be returned is 0.

Callback Function Syntax
function callbackFunction(value, index, array)

Callback Function Parameters
value The value of the element in the array
index The index position of the element in the array
array The source array object that contains the element

Example 1 : Retrieve only even numbers from myArray

// Callback function
function IsEven(value, index, array)
{
    if (value % 2 == 0)
    {
        return true;
    }
    else
    {
        return false;
    }
}

// Source array
var myArray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

// Pass the callback function as argument to the filter method
var result = myArray.filter(IsEven);

document.write(result);

Output : 2,4,6,8,10

Example 2 : In Example 1 we defined a callback function first and then passed it as an argument to the filter() method. In the example below, we created the callback function as an anonymous function directly in the filter method where it is required.

// Source array
var myArray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

// callback function created directly in the filter method as anonymous function
var result = myArray.filter(function (v, i, a) { return v % 2 == 0 });

document.write(result);

Output : 2,4,6,8,10

Example 3 : Remove duplicates from javascript array

var myArray = ["Sam", "Mark", "Tim", "Sam"];

var uniqueItems = myArray.filter(function (v, i, a) { return a.indexOf(v) == i });

document.write(uniqueItems);

Output :
Sam,Mark,Tim

JavaScript tutorial

3 comments:

  1. logic to remove duplicate element was awesome!!.. Thank you :)

    ReplyDelete
  2. indexof() method return first occurrence of element that is 0 for "Sam" always.

    ReplyDelete
  3. how could we can enter data that is not same that already exists

    ReplyDelete

It would be great if you can help share these free resources