Remove array element on condition

You can use Array filter method.

The code would look like this:

ar = [1, 2, 3, 4];
ar = ar.filter(item => !(item > 3));
console.log(ar) // [1, 2, 3]

You can use Array.filter(), which does the opposite:

ar.filter(function(item, idx) {
    return item <= 3;
});

You can use lodash.remove

var array = [1, 2, 3, 4];
var evens = _.remove(array, function(n) {
  return n % 2 == 0;
});

console.log(array);
// => [1, 3]

console.log(evens);
// => [2, 4]

Make it a one-liner with arrow function:

ar = ar.filter(i => i > 3);

if you need to remove exactly one item, and you know for sure that the item exists, you can use splice:

ar.splice(ar.findIndex(el => el.id === ID_TO_REMOVE), 1);

http://jsfiddle.net/oriadam/72kgprw5/

Warning the above fails when item is not found, so use it when you already checked it is there for some reason.

EDIT: filter works, but in some cases you may prefer to use splice. it is ~10 times faster than filter and changes the array in situ.

For example, when you need to work with the item before removing it:

let foundIdx=arr.findIndex(x=>x.id=123);
if (foundIdx>=0) {
    const found=arr[foundIdx];
    /* ...do things with found item... */
    arr.splice(foundIdx,1); 
}

simply write the following example if condition could work on object properties as well

var ar = [ {num:1, str:"a"}, {num:2, str:"b"}, {num:3, str:"c"} ];
var newArray = [];
for (var i = 0, len = ar.length; i<len; i++) {
        if (ar[i].str == "b") 
        {newArray.push(ar[i]);};
 };
console.log(newArray);

See the example Live Example

I love these kinds of questions and just a different version from me too... :)

Array.prototype.removeIf = function(expression) {
   var res = [];
    for(var idx=0; idx<this.length; idx++)
    {
      var currentItem = this[idx];
        if(!expression(currentItem))
        {
            res.push(currentItem);
        }
    }
    return res;
}

ar = [ 1, 2, 3, 4 ];
var result = ar.removeIf(expCallBack);


console.log(result);
function expCallBack(item)
{
    return item > 3;
}

My solution for an array of numbers would be:

ar = ar.filter(item => item < 4);

Incorrect way

First of all, any answer that suggests to use filter does not actually remove the item. Here is a quick test:

var numbers = [1, 2, 2, 3];
numbers.filter(x => x === 2);
console.log(numbers.length);

In the above, the numbers array will stay intact (nothing will be removed). The filter method returns a new array with all the elements that satisfy the condition x === 2 but the original array is left intact.

Sure you can do this:

var numbers = [1, 2, 2, 3];
numbers = numbers.filter(x => x === 2);
console.log(numbers.length);

But that is simply assigning a new array to numbers.

Correct way to remove items from array

One of the correct ways, there are more than 1, is to do it as following. Please keep in mind, the example here intentionally has duplicated items so the removal of duplicates can be taken into consideration.

var numbers = [1, 2, 2, 3];

// Find all items you wish to remove
// If array has objects, then change condition to x.someProperty === someValue
var numbersToRemove = numbers.filter(x => x === 2);

// Now remove them
numbersToRemove.forEach(x => numbers.splice(numbers.findIndex(n => n === x), 1));

// Now check (this is obviously just to test)
console.log(numbers.length);
console.log(numbers);

Now you will notice length returns 2 indicating only numbers 1 and 3 are remaining in the array.

For the in-place remove, my solution is

ar.filter(item => !(item > 3))
  .forEach(obsoleteItem => ar.splice(ar.indexOf(obsoleteItem), 1));

If you want to remove items from an array and have them also leave the original array (like you are picking out your favourite sweets) you could try this:

function takeFromList(array, condition) {

    const taken = []

    for (let i = array.length -1; i >= 0 ; i--) {
        const y = array[i]
        
        if(condition(y)){
            taken.unshift(...array.splice(i, 1))           
        }
        
    }
    return taken
}

const pickAndMix = ["Skittles", "Fizzers", "Jelly Babies" ,"Skittles", 
    "Haribo Goldbears", "Love Hearts", "Haribo Goldbears", "Skittles", "Fizzers"]

const selection = takeFromList(pickAndMix, (x) => x === "Skittles")

console.log(selection)
console.log(pickAndMix)

// returns ["Skittles", "Skittles", "Skittles"]
// returns ["Fizzers", "Jelly Babies", "Haribo Goldbears", "Love Hearts", 
//  "Haribo Goldbears", "Fizzers"]

This is the new best solution making the previous solutions complex and slow,
using the power .findLast() widely available in JavaScript since 2022.

array.findLast((elem, idx, arr) => (test(elem) && arr.splice(idx, 1), false))

Wrapped into an Array extension:

Array.prototype.removeAllBy = function(predicate) {
   // removes all elements matching the given predicate
   // `findLast` enables efficient array iteration
   this.findLast((elem, idx) => (predicate(elem) && this.splice(idx, 1), false))
}

arr = [1,2,3,4,5,6]
arr.removeBy(e => e > 3)
console.log(arr) // [1, 2, 3]

This is a simple and fast solution while keeping readibility, mutating the original array in place.

Most of the other answers using arr.forEach then arr.findIndex are iterating two times over the array for finding the items to removed. Mine does it only once, that is around 33% faster on average for this part.

The accepted answer iterates only once but it uses manual iteration. That is hard to read and slightly slower than built-in methods profiting from natvie engine optimizations. It also introduces more array reindexing load when removing elements by splice() caused by the forward searching.