CODEWITHSUNDEEP
javascriptarraysfilteringchainingmethod-chaining
awj
awj

Reputation: 7949

JavaScript: why can't I chain Array.prototype.filter with .push()?

If Array.prototype.filter returns an array, why can't I invoke push() on this return value immediately?

Example:

var arr = ["a", "ab", "c", "ad"];
var arr2 = arr.filter(function(elmnt) { return elmnt.indexOf("a") > -1; });
// result: ["a", "ab", "ad"]

arr2.push("aaa");
// result: ["a", "ab", "ad", "aaa"]

Ok so far.

But what about chaining that push() call to the filter() call?

var arr = ["a", "ab", "c", "ad"];
var arr2 = arr.filter(function(elmnt) { return elmnt.indexOf("a") > -1; }).push("aaa");
// result: 4

Why does chaining filter() and push() result in the number of elements that I would expect, rather than an array of those elements?

Upvotes: 5

Views: 9980

Answers (3)

Deependra Bahadur R
Deependra Bahadur R

Reputation: 1

now run the above code and see the result/error.

Analyze the difference between your answer before and after running the code

Q2. correct the code so that method chain starts working

function filterOddNumbers(num) {
    if (num % 2 === 0) {
        return true;
    } else {
        return false;
    }
}

const evenNumbers = [1, 2, 3, 4, 5].push().filter(filterOddNumbers);

Upvotes: -1

Thomas Chirwa
Thomas Chirwa

Reputation: 341

I suggest you use concat();

var arr = ["a", "ab", "c", "ad"], arr2;
(arr2 = arr.filter(function(elmnt) { return elmnt.indexOf("a") > -1; })).concat("aaa");
// now arr2 is ["a", "ab", "ad", "aaa"]

Upvotes: 4

techfoobar
techfoobar

Reputation: 66663

The problem is not with what filter() returns, instead it is with what push() returns.

push() returns the new length of the array, and not the array itself.

So when you do:

var arr2 = arr.filter(function(elmnt) { return elmnt.indexOf("a") > -1; }).push("aaa");

arr2 will be assigned the new length of the array (which happens to be 4 in your case), and not the new array as such.

A modified version that'll do what you want would be:

var arr = ["a", "ab", "c", "ad"], arr2;
(arr2 = arr.filter(function(elmnt) { return elmnt.indexOf("a") > -1; })).push("aaa");
// now arr2 is ["a", "ab", "ad", "aaa"]

Upvotes: 11

Related Questions