JavaScript filter callback that uses arguments

Question

The goal is to filter an array and remove all occurrences of elements specified in its argument list.

For example, given removeElements([1, 2, 3, 1, 2, 3,4], 2, 3), my output should be [1,1,4].

function removeElements(arr) {
//I got an error that says **functions** not allowed **inside loop**
  for(var i=1;i<arguments.length;i++){
    arr= arr.filter(function(e){
        return e!==arguments[i];
    });
  }
  return arr;
}

Second thing I tried is moving the filter out of the for loop.

function removeElements(arr) {
  function isNotEqual(e){
    return e!==this;
  }
  for(var i=1;i<arguments.length;i++){
    arr= arr.filter(isNotEqual,arguments[i]);
  }
  return arr;
}

None of them work. It always return arr as [1,2,3,1,2,3,4]. Can you please tell as to what is wrong in my usage? Or what is the approach for using filter in this scenario?

In the first snippet, the arguments variable will hold a different value for each function, including those that are embedded within other functions, like the iterator given to .filter(). — Jonathan Lonowski
– Jonathan Lonowski, Commented Nov 13, 2015 at 6:20
I don't know why you'd get an error message about calling a function inside a loop, but the first version won't work because in the inner function you reference arguments as if you are getting the outer function's arguments. — nnnnnn
– nnnnnn, Commented Nov 13, 2015 at 6:21
That "error message" is not a native JavaScript error. You must be using some kind of linter. Which one is it? — Felix Kling
– Felix Kling, Commented Nov 13, 2015 at 6:30
As @azzi suggests, this is the duplicate of the question here. — dot
– dot, Commented Nov 13, 2015 at 8:04

arcyqwerty · Accepted Answer · 2015-11-13 06:21:12Z

10

You can use Array.prototype.slice to get the blacklisted elements in array form.

Then use Array.prototype.indexOf to see if a given element is in the array for the filter function.

http://jsfiddle.net/Loothof7/

function removeElements(arr) {
  var blacklist = Array.prototype.slice.call(arguments, 1);
  return arr.filter(function(e) {
    return blacklist.indexOf(e) == -1;
  });
}

alert(removeElements([1, 2, 3, 1, 2, 3,4], 2, 3));

Note that Function.prototype.call is used on Array.prototype.slice with the this scope argument of arguments instead of directly calling arguments.slice since arguments isn't actually a "real" array.

answered Nov 13, 2015 at 6:21

arcyqwerty

10.8k4 gold badges53 silver badges91 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jonathan Lonowski · Accepted Answer · 2015-11-13 07:29:05Z

5

To try to explain the reasons the snippets didn't succeed:

Every function defines its own arguments, even when the function is embedded.

function removeElements(arr) {
    console.log(arguments);
    // Arguments {
    //   0: Array [1, 2, 3, 1, 2, 3, 4],
    //   1: 2,
    //   2: 3
    // }

    arr = arr.filter(function (e) {
        console.log(arguments);
        // Arguments {
        //   0: 1, 2, 3, 1, ...             (each value in `arr`)
        //   1: 0, 1, 2, 3, ...             (each index)
        //   2: Array [1, 2, 3, 1, 2, 3, 4] (`arr` itself)
        // }

        // ...
    });

    return arr;
}

removeElements([1, 2, 3, 1, 2, 3, 4], 2, 3);

By retrieving values from arguments inside of the iterator (function(e) {...}), the statement will compare e against values in the 2nd Arguments.

for(var i=1;i<arguments.length;i++){
    arr = arr.filter(function(e){
        // 1st = 0              (the first index from `arr`)
        // 2nd = [1, 2, 3, ...] (the `arr` itself)
        console.log(arguments[i]);

        return e!==arguments[i];
    });
}

One option to resolve this is to access arguments outside of the iterator function, stashing the value in a variable that won't have the same conflict:

for(var i=1;i<arguments.length;i++){
    var skip = arguments[i];
    arr = arr.filter(function (e) {
        return e !== skip;
    });
}

http://jsfiddle.net/y7evq6nq/

If you're not using strict mode, the value of this will always be an Object.

When you provide a primitive value for a thisArg, it will be boxed into its equivalent Object type. In this case, a new Number.
```
function foo() {
    console.log(typeof this, this); // 'object' Number(3)
    return true;
}

[0].filter(foo, 3);
```
And, since === first checks for type equality, a primitive and boxed number cannot be equal:
```
var number = 3;
var boxedNumber = new Number(3);

console.log(typeof number);      // 'number'
console.log(typeof boxedNumber); // 'object'

console.log(typeof number === typeof boxedNumber); // false
console.log(number === boxedNumber);               // false
```
You can use the .valueOf() method to retrieve the primitive value from the object.
```
function isNotEqual(e){
  return e!==this.valueOf();
}
```
http://jsfiddle.net/ow9b78bf/

Or, you can try using strict mode, which allows this to hold a primitive value without boxing it.

edited Nov 13, 2015 at 7:29

answered Nov 13, 2015 at 7:23

Jonathan Lonowski

124k35 gold badges203 silver badges202 bronze badges

2 Comments

dot Over a year ago

Is it possible to pass more than one argument as thisArg? arr.filter(callback,thisArg1,thisArg2,thisArg3)?

Jonathan Lonowski Over a year ago

Not in that manner. .filter() only accepts one value for it and will use it for each call to the iterator. What you can do is pass an Array or other Object as the one value that in turns contains all of the other values you want to pass together.

Alexei Levenkov · Accepted Answer · 2015-11-13 06:21:19Z

2

arguments are function specific pseudo-variable. Using it inside callback will give arguments of callback and not outer function.

function removeElements(arr) {
  var args = Array.prototype.slice.call(arguments);
  for(var i=1;i<args.length;i++){
    arr= arr.filter(function(e){
        return e!==args[i];
    });
  }
}

answered Nov 13, 2015 at 6:21

Alexei Levenkov

101k15 gold badges138 silver badges189 bronze badges

Comments

Community · Accepted Answer · 2017-05-23 11:52:55Z

1

I have already answered this type of question here any way I post it to you

A simple function

function filter(){
    var j = -1; 
    for(var i = 1; i < arguments.length; i++){
        j = arguments[0].indexOf(arguments[i]);
        if(j > -1){
           arguments[0].splice(j, 1);
        }
    }
    return arguments[0];
}

you can call this function with no of args eg:

 filter([1,2,3,4,5,6,7,8,9], 1, 3, 5); //return [2,4,6,7,8,9]
 filter([1,2,3,4,5,6,7,8,9], 1); //return [2,3,4,5,6,7,8,9]

edited May 23, 2017 at 11:52

CommunityBot

11 silver badge

answered Nov 13, 2015 at 6:27

Azad

5,2725 gold badges31 silver badges59 bronze badges

Comments

STR.split · Accepted Answer · 2016-12-05 20:32:41Z

1

This will use a callback function to check against the two numbers given in the arguments list.

function removeElements(arr, num1, num2){
  return arr.filter(numChecks(num1, num2));
  
}
function numChecks(num1, num2){
  return function(element){
    return element !== num1 && element !== num2;
  }
}
removeElements([1, 2, 3, 1, 2, 3,4], 2, 3)

answered Dec 5, 2016 at 20:32

STR.split

235 bronze badges

Comments

David Gomez · Accepted Answer · 2015-11-13 07:18:03Z

0

I think this is what you want to do, maybe I'm wrong.

var result = [1, 2, 3, 1, 2, 3, 4].filter(function(item) {
  return item !== 1 && item !== 2;
});

console.log(result); // [3, 3, 4]

UPDATE:

This function can do the job you want passing the items to be remove as an array instead of turning the arguments[1] param an Array using slice.call():

function removeItems(arr, items) {
  return arr.filter(function (elem) {
    return items.indexOf(elem) === -1;
  });
}

var result = removeItems([1, 2, 3, 1, 2, 3, 4], [2, 3]);

console.log(result); // [1, 1, 4]

edited Nov 13, 2015 at 7:18

answered Nov 13, 2015 at 6:21

David Gomez

2,7822 gold badges21 silver badges28 bronze badges

2 Comments

David Gomez Over a year ago

No, I used 1 and 2 instead of 2 and 3, you just have to change the values, or pass them as arguments to a function, but that's the way filter works

CY5 Over a year ago

but 1 and 2 needs to be pass as argument you have hardcoded

MHernandez · Accepted Answer · 2016-10-01 02:45:55Z

-1

There are really good answers here, but you can do it very clean in this way, remember you have an objects option in filter method which you can use in the callback function, in this case i'm using it like : arguments[i] so I can check every value in the arguments array

function destroyer(arr) {

   for(var i = 1; i < arguments.length; i++){
     arr = arr.filter(isIn, arguments[i]);
   } 

  function isIn(element,index, array){
     if (element != this){
        return element;
     }
  }  

  return arr;
}

answered Oct 1, 2016 at 2:45

MHernandez

316 bronze badges

1 Comment

MC9000 Over a year ago

explain your answer - where did "index" and "array" come from? where did you access the arguments inside the filter function?

Collectives™ on Stack Overflow

JavaScript filter callback that uses arguments

7 Answers 7

Comments

2 Comments

Comments

Comments

Comments

2 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

Comments

2 Comments

Comments

Comments

Comments

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related