Removing from a javascript array. JavaScript Removing elements from an array



How to remove an element from an array by value?

(20)

// edited thanks to MarcoCI for the advice

try it:

Function wantDelete(item, arr)( for (var i=0;i !(comment.Id === commentId));

Here's a version that uses jQuery's inArray function:

Var index = $.inArray(item, array); if (index != -1) ( array.splice(index, 1); )

You can achieve this using the Lodash _.remove function.

var array = ["three", "seven", "eleven"]; var evens = _.remove(array, function(e) ( return e !== "seven"; )); console.log(evens);

Const _ = require("lodash"); _.without(, 2); // ->

Really, I don't understand why this can't be solved with

Arr = arr.filter(value => value !== "seven");

Or maybe you want to use vanilla JS

Arr = arr.filter(function(value) ( ​​return value !== "seven" ));

Another variant:

If (!Array.prototype.removeArr) ( Array.prototype.removeArr = function(arr) ( if(!Array.isArray(arr)) arr=;//let"s be nice to people who put a non-array value here.. that could be me! var that = this; if(arr.length)( var i=0; while(i-1)( that.splice(i,1); )else i++; ) ) return that; ) )

This is indexOf() inside the loop again, but under the assumption that the array to be deleted is small relative to the array to be cleared; each deletion shortens the while loop.

This will allow you to do the following:

Var ary = ["three", "seven", "eleven"]; var aryWithoutSeven = ary.filter(function(value) ( ​​return value != "seven" )); console.log(aryWithoutSeven); // returns ["three", "eleven"]

This was also noted in this thread elsewhere: https://.com/a/20827100/293492

Don't use the delete option - it makes a hole in the array, since it doesn't reindex the elements after the deleted element.

> Array.prototype.remove=function(v)( ... delete this ... );

> var myarray=["3","24","55","2"]; undefined > myarray.remove("55"); undefined > myarray [ "3", "24", "2" ]

One liner will do it,

filter() calls the provided callback function once for each element in the array and creates a new array of all values ​​for which the callback returns a value that evaluates to true. callback is called only for array indices that have assigned values; it is not called for indexes that have been dropped or that were never assigned values. Array elements that fail the callback test are simply skipped and not included in the new array.

So basically, it's the same as all the other for (var key in ary) ( ... ) solutions, except that for in is supported as IE6.

Basically, a filter is a convenience method that looks much nicer (and is chainable) as opposed to a for in constructor (AFAIK).

Check it:

For(var i in array)( if(array[i]=="seven")( array.splice(i,1); break; ) )

and in the function:

Function removeItem(array, item)( for(var i in array)( if(array[i]==item)( array.splice(i,1); break; ) ) ) removeItem(array, "seven");

Removing all matching elements from an array (not just the first one, as seems to be the most general answer here):

While ($.inArray(item, array) > -1) ( array.splice($.inArray(item, array), 1); )

I used jQuery for the heavy lifting, but you get the idea if you want to go native.

The trick is to go through the array from start to start so you don't mess up the indices when you remove elements.

Var deleteMe = function(arr, me)( var i = arr.length; while(i--) if(arr[i] === me) arr.splice(i,1); ) var arr = ["orange ","red","black", "orange", "white" , "orange" ]; deleteMe(arr, "orange");

arr is now ["red", "black", "white"]

Function cleanArrayOfSpecificTerms(array,unwantedTermsArray) ( $.each(unwantedTermsArray, function(index, value) ( ​​var index = array.indexOf(value); if (index > -1) ( array.splice(index, 1); ) ) ); return array;

To use, follow these steps:

Var notInclude = ["Not","No","First","Last","Prior","Next", "dogs","cats"]; var splitTerms = ["call", "log", "dogs", "cats", "topic", "change", "pricing"]; cleanArrayOfSpecificTerms(splitTerms,notInclude)

I tried using the function method from jbaron above, but found that I needed to keep the original array unchanged for use later and create a new array like this:

Var newArray = referenceArray;

Function newArrRemoveItem(array, item, newArray)( for(var i = 0; i< array.length; i++) { if(array[i]!=item){ newArray.push(array[i]); } } }

Then I use it like this:

Var vesselID = record.get("VesselID"); var otherVessels = new Array(); newArrRemoveItem(vesselArr,vesselID,otherVessels);

Now the vesselArr remains intact and every time I execute the above code, the otherVessels array includes everything except the last CAID element.

indexOf is an option, but its implementation basically searches the entire array for a value, so the execution time increases with the size of the array. (so it's in every browser, I think, I only checked Firefox).

I don't have IE6 to test with, but I'd call it a safe bet that you can test at least a million array elements per second this way on almost any client machine. If [array size] * [search queries per second] is likely to grow beyond a million, you should consider a different implementation.

Basically you can use an object to create an index on your array, like this:

Var index=("three":0, "seven":1, "eleven":2);

Any normal JavaScript framework will create a search index for such objects so that you can quickly translate a key into a value, no matter how many properties the object has.

This is just a basic method, depending on your needs you can combine multiple objects and/or arrays to make the same data quickly searchable for different properties. If you specify your specific needs, I can suggest a more specific data structure.

//This function allows you to remove even array from array var removeFromArr = function(arr, elem) ( var i, len = arr.length, new_arr = , sort_fn = function (a, b) ( return a - b; ); for ( i = 0;< len; i += 1) { if (typeof elem === "object" && typeof arr[i] === "object") { if (arr[i].toString() === elem.toString()) { continue; } else { if (arr[i].sort(sort_fn).toString() === elem.sort(sort_fn).toString()) { continue; } } } if (arr[i] !== elem) { new_arr.push(arr[i]); } } return new_arr; }

Usage example

Var arr = , "abc", 1, "1", 1]; removeFromArr(arr, 1); //["2", , "abc", "1"] var arr = [ , 2, "a", , ]; removeFromArr(arr, ); //]

Let arr = ; console.log(arr); //result let index = arr.indexOf(30); if (index > -1) ( arr.splice(index, 1); ) console.log(arr); //result

Var index = array.indexOf("item"); if(index!=-1)( array.splice(index, 1); )

shift

Use .shift to remove the first element of an array.

For example:

Var array = ; array.shift();

the array results in:

For example:

Var array = ; array.pop();

the array results in:

Both methods return the removed element;

splice

Use .splice() to remove a series of elements from an array. .splice() takes two parameters, a starting index and an optional number of elements to remove. If the second parameter is not .splice() will remove all elements from the starting index through the end of the array.

For example:

Var array = ; array.splice(1, 2);

leaves an array containing:

array.splice() returns is a new array containing the removed elements. In the above example the return would be:

So omitting the second parameter effectively splits the array into two arrays with the original ending at the specified index:

Var array = ; array.splice(2);

Leaves array containing and returns .

delete

Use delete to remove an element from an array without changing the length of the array:

Var array = ; console.log(array.length); // 5 delete array; console.log(array); // console.log(array.length); // 5

Array.prototype.length

Assigning length to an array changes the length to the specified value. If the new value is less than the length of the array, elements will be removed from the end of the value.

Array = ; array.length = 2; console.log(array); //

The JavaScript delete operator removes a property from an object; if no more references to the same property are held, it is eventually released automatically.

The source for this interactive example is stored in a GitHub repository. If you"d like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

Syntax delete expression

Any variable defined with var is marked as non-configurable. In the following example, salary is non-configurable and cannot be deleted. In non-strict mode, the delete operation will return false .

Function Employee() ( delete salary; var salary; ) Employee();

Let's see how the same code behaves in strict mode. Instead of returning false , the statement raises a SyntaxError .

"use strict"; function Employee() ( delete salary; // SyntaxError var salary; ) // Similarly, any direct access to a function // with delete will raise a SyntaxError function DemoFunction() ( //some code ) delete DemoFunction; // SyntaxError

Examples // Creates the property adminName on the global scope. adminName = "xyz"; // Creates the property empCount on the global scope. // Since we are using var, this is marked as non-configurable. The same is true of let and const. var empCount = 43; EmployeeDetails = ( name: "xyz", age: 5, designation: "Developer" ); // adminName is a property of the global scope. // It can be deleted since it is created without var, // and is therefore configurable. delete adminName; // returns true // On the contrary, empCount is not configurable // since var was used. delete empCount; // returns false // delete can be used to remove properties from objects. delete EmployeeDetails.name; // returns true // Even when the property does not exist, delete returns "true". delete EmployeeDetails.salary; // returns true // delete does not affect built-in static properties. delete Math.PI; // returns false // EmployeeDetails is a property of the global scope. // Since it was defined without "var", it is marked configurable. delete EmployeeDetails; // returns true function f() ( var z = 44; // delete doesn't affect local variable names delete z; // returns false ) delete and the prototype chain

In the following example, we delete an own property of an object while a property with the same name is available on the prototype chain:

Function Foo() ( this.bar = 10; ) Foo.prototype.bar = 42; var foo = new Foo(); // foo.bar is associated with the // own property. console.log(foo.bar); // 10 // Delete the own property within the // foo object. delete foo.bar; // returns true // foo.bar is still available in the // prototype chain. console.log(foo.bar); // 42 // Delete the property on the prototype. delete Foo.prototype.bar; // returns true // The "bar" property can no longer be // inherited from Foo since it has been // deleted. console.log(foo.bar); // undefined

Deleting array elements

When you delete an array element, the array length is not affected. This holds even if you delete the last element of the array.

When the delete operator removes an array element, that element is no longer in the array. In the following example, trees are removed with delete .

Var trees = ["redwood", "bay", "cedar", "oak", "maple"]; delete trees; if (3 in trees) ( // this is not executed )

If you want an array element to exist but have an undefined value, use the undefined value instead of the delete operator. In the following example, trees is assigned the value undefined, but the array element still exists:

Var trees = ["redwood", "bay", "cedar", "oak", "maple"]; trees = undefined; if (3 in trees) ( // this is executed )

If instead, you want to remove an array element by changing the contents of the array, use the splice method. In the following example, trees are removed from the array completely using splice :

Var trees = ["redwood", "bay", "cedar", "oak", "maple"]; trees.splice(3,1); console.log(trees); // ["redwood", "bay", "cedar", "maple"]

Specifications Specification Status Comment
ECMAScript Latest Draft (ECMA-262)
Draft
ECMAScript 2015 (6th Edition, ECMA-262)
The definition of "The delete Operator" in that specification.
Standard
ECMAScript 5.1 (ECMA-262)
The definition of "The delete Operator" in that specification.
Standard
ECMAScript 1st Edition (ECMA-262)
The definition of "The delete Operator" in that specification.
Standard Initial definition. Implemented in JavaScript 1.2.
Browser compatibility

The compatibility table on this page is generated from structured data. If you"d like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

Update compatibility data on GitHub

Desktop Mobile Server Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet Node.jsdelete
Chrome Full support 1Edge Full support 12Firefox Full support 1IE Full support 4Opera Full support YesSafari Full support YesWebView Android Full support 1Chrome Android Full support 18Firefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support 1.0nodejs Full support Yes
Legend Full support Full support Cross-browser notes

Although ECMAScript makes iteration order of objects implementation-dependent, it may appear that all major browsers support an iteration order based on the earliest added property coming first (at least for properties not on the prototype). However, in the case of Internet Explorer, when one uses delete on a property, some confusing behavior results, preventing other browsers from using simple objects like object literals as ordered associative arrays. In Explorer, while the property value is indeed set to undefined, if one later adds back a property with the same name, the property will be iterated in its old position--not at the end of the iteration sequence as one might expect after having deleted the property and then added it back.

There are several methods to remove an array element in JavaScript. These include the pop and shift methods. The pop method removes the first element from the given array. The shift method removes the last element from the given array.

You can set the array length to 0 if you want to remove all elements from the given array. But what, do you need to remove a specific element?

For example:

Array_name.splice(index);

Array_name.delete

You can use the splice method. It returns a new array of removed elements. And the original array contains the remaining elements.

Check out the demo below to learn how to use the JavaScript splice method and other ways to remove specific elements.

Demonstration of removing a specific element using the splice method

This demo creates an array of numbers. Initially, five elements are added to the array. After this, the splice method is used to remove the third element. In the same way, you can remove the first element of an array in JavaScript.

The elements of a numeric array are displayed before and after using the JavaScript splice method like this:

JavaScript code with splice method:


"; for (i=0; i< Arr_Numbers.length; i++){ the_arr_before_after += Arr_Numbers[i] + "
"; ) document.getElementById("p1").innerHTML = the_arr_before_after; Arrretrun = Arr_Numbers.splice(2,1); var the_arr_before_after = "Array elements after splice method:
"; for (i=0; i< Arr_Numbers.length; i++){ the_arr_before_after += Arr_Numbers[i] + "

You'll notice that I used two parameters for JavaScript to remove an array element. The first specifies the index of the element to be removed. The second is how many elements need to be removed after the specified key.

The following demo shows a case where we use the second parameter.

What if the second parameter is not specified in the JavaScript splice method?

Using the same code, but without the second parameter in the splice method:

Arr_Numbers.splice(2);

Code and result:

View online demo and code

As you can see, all elements before the specified index number have also been removed. In addition, the splice method returns an array of removed elements.

JavaScript code:

var Arr_Numbers = ; var i; var the_arr_before_after = "The original array:
"; for (i=0; i< Arr_Numbers.length; i++){ the_arr_before_after += Arr_Numbers[i] + "
"; ) document.getElementById("p1").innerHTML = the_arr_before_after; Arrretrun = Arr_Numbers.splice(2); var the_arr_before_after = "Array elements after splice method:
"; for (i=0; i< Arr_Numbers.length; i++){ the_arr_before_after += Arr_Numbers[i] + "
"; ) document.getElementById("p2").innerHTML = the_arr_before_after; //Removed array elements in the returned array var the_arr_before_after = "The removed array elements:
"; for (i=0; i< Arrretrun.length; i++){ the_arr_before_after += Arrretrun[i] + "
"; ) document.getElementById("p3").innerHTML = the_arr_before_after;

Using the delete function to remove an array element

You can also use the delete function to delete an array element in JavaScript. But it saves empty space, and if you return that array after using the function, the removed element will be rendered as undefined .

Let's look at a demo that uses the delete function:

View online demo and code

JavaScript code:

var Arr_Strings = ["The","JavaScript","Array","Totorial"]; var i; var the_arr_before_after = "The original string array elements:

"; for (i=0; i< Arr_Strings.length; i++){ the_arr_before_after += Arr_Strings[i] + "
"; ) document.getElementById("p1").innerHTML = the_arr_before_after; //Using the delete function delete Arr_Strings; var the_arr_before_after = "Array elements after splice method:

"; for (i=0; i< Arr_Strings.length; i++){ the_arr_before_after += Arr_Strings[i] + "
"; ) document.getElementById("p2").innerHTML = the_arr_before_after;

You can see that the third element shows undefined after it was deleted using the delete function.



How to remove a specific element from an array in JavaScript?

(20)

I have an array of integers and I am using the .push() method to add elements to it.

Is there an easy way to remove a specific element from an array? Equivalent to something like array.remove(int); , I should use base JavaScript - none

frames are not allowed.

ES6 and without mutation: (Oct 2016) const removeByIndex = (list, index) => [ ...list.slice(0, index), ...list.slice(index + 1) ];

RemoveByIndex(,1) //=>
  • Edited October 2016
  • Make it simple, intuitive and explicit (https://en.wikipedia.org/wiki/Occam%27s_razor)
  • Make it immutable (the original array will remain unchanged)

Do this with standard JS functions, if your browser doesn't support them - use a polyfill

Removing an item (ECMA-262 Edition 5 code aka oldstyle JS) var value = 3 var arr = arr = arr.filter(function(item) ( return item !== value )) console.log(arr) // [ 1, 2, 4, 5 ] Removing an item (ES2015 code) let value = 3 let arr = arr = arr.filter(item => item !== value) console.log(arr) // [ 1, 2, 4, 5 ]

IMPORTANT ES2015 "() => ()" arrow function syntax is not supported in IE at all, Chrome before version 45, Firefox before version 22, Safari before version 10. To use ES2015 syntax in older browsers you can use BabelJS

Removing multiple items (ES2016 code)

An additional benefit of this method is that you can remove multiple elements

Let forDeletion = let arr = arr = arr.filter(item => !forDeletion.includes(item)) // !!! Read below about array.includes(...) support!!! console.log(arr) // [ 1, 4 ]

IMPORTANT "array.includes(...)" is not supported in IE at all, Chrome before version 47, Firefox before version 43, Safari before version 9 and Edge before version 14, so

Removing multiple elements (Advanced Experimental JavaScript ES2018?) // array-lib.js export function remove(...forDeletion) ( return this.filter(item => !forDeletion.includes(item)) ) // main.js import ( remove ) from "./array-lib.js" let arr = // :: This-Binding Syntax Proposal // using "remove" function as "virtual method" // without extending Array.prototype arr = arr::remove (2, 3, 5) console.log(arr) // [ 1, 4 ]

Here are some ways to remove an element from an array using JavaScript.

All the methods described do not change the original array and instead create a new one.

If you know the element index

Let's say you have an array and you want to remove the element at position i .

One way is to use slice() :

const items = ["a", "b", "c", "d", "e", "f"] const i = 3 const filteredItems = items.slice(0, i-1).concat(items. slice(i, items.length)) console.log(filteredItems)

slice() creates a new array with the indices it receives. We simply create a new array - from the start to the index we want to delete, and concatenate another array from the first position following the one we deleted to the end of the array.

If you know the meaning

In this case, one good option is to use filter() which offers more declarative an approach:

const items = ["a", "b", "c", "d", "e", "f"] const valueToRemove = "c" const filteredItems = items.filter(item => item !== valueToRemove) console.log(filteredItems)

This uses ES6 arrow functions. You can use traditional functions to support older browsers:

const items = ["a", "b", "c", "d", "e", "f"] const valueToRemove = "c" const filteredItems = items.filter(function(item) ( return item != = valueToRemove )) console.log(filteredItems)

or you can use Babel and convert the ES6 code back to ES5 to make it more readable for older browsers, but write modern JavaScript in your code.

Removing multiple items

What if instead of one element you want to delete many elements?

Let's find the simplest solution.

By index

You can simply create a function and remove elements sequentially:

const items = ["a", "b", "c", "d", "e", "f"] const removeItem = (items, i) => items.slice(0, i-1).concat (items.slice(i, items.length)) let filteredItems = removeItem(items, 3) filteredItems = removeItem(filteredItems, 5) //["a", "b", "c", "d"] console. log(filteredItems)

By value

You can look for inclusion inside the callback function:

const items = ["a", "b", "c", "d", "e", "f"] const valuesToRemove = ["c", "d"] const filteredItems = items.filter(item => !valuesToRemove.includes(item)) // ["a", "b", "e", "f"] console.log(filteredItems)

Avoid mutating the original array

splice() (not to be confused with slice()) mutates the original array and should be avoided.

You can use ES6.

Var array=["1","2","3","4","5","6"] var index = array.filter((value)=>value!="3");

["1", "2", "4", "5", "6"]

You can do this easily with the filter method:

Function remove(arrOriginal, elementToRemove)( return arrOriginal.filter(function(el)(return el !== elementToRemove)); ) console.log(remove(, 1));

This removes all elements from the array and also works faster than the slice and indexOf combination

You should never mutate an array of an array. Because it goes against the functional programming pattern. You can create a new array without a reference to the array you want to modify using the es6 method filter;

Var myArray = ;

Let's say you want to remove 5 from an array, you can simply do it like this.

MyArray = myArray.filter(value => value !== 5);

This will give you a new array without the value you want to remove. So the result will be

; // 5 has been removed from this array

For further understanding you can read the MDN documentation on Array.filter filter

If you want a new array with positions removed, you can always remove a specific element and filter the array. It might be necessary to extend the array object for browsers that don't implement the filter method, but in the long run it's easier since all you're doing is this:

Var my_array = ; delete my_array; console.log(my_array.filter(function(a)(return typeof a !== "undefined";)));

Should be displayed

If you have complex objects in an array, can you use filters? In situations where $.inArray or array.splice are not so easy to use. Especially if the objects are perhaps small in the array.

For example, if you have an object with an Id field and you want the object to be removed from the array:

This.array = this.array.filter(function(element, i) ( return element.id !== idToRemove; ));

Find the index of the array element you want to remove, then remove that index using splice .

The splice() method modifies the contents of an array by removing existing elements and/or adding new elements.

var array = ; console.log(array) var index = array.indexOf(5); if (index > -1) ( array.splice(index, 1); ) // array = console.log(array);

The second parameter to splice is the number of elements to remove. Note that splice modifies the array in place and returns a new array containing the removed elements.

You have 1 to 9 arrays and want to remove 5 using the code below.

var numberArray = ; var newNumberArray = numberArray.filter(m => ( return m !== 5; )); console.log("new Array, 5 removed", newNumberArray);

If you want to use multiple ex values: - 1,7,8

var numberArray = ; var newNumberArray = numberArray.filter(m => ( return (m !== 1) && (m !== 7) && (m !== 8); )); console.log("new Array, 5 removed", newNumberArray);

If you want to remove array value in ex array:-

var numberArray = ; var removebleArray = ; var newNumberArray = numberArray.filter(m => ( return !removebleArray.includes(m); )); console.log("new Array, removed", newNumberArray);

includes supported browser - link

I know there are many answers already, but many of them seem to complicate the problem. Here's a simple, recursive way to remove all instances of a key - call self until the index is found. Yes, it only works in browsers indexOf , but it's simple and can be filled in easily.

Offline function

Function removeAll(array, key)( var index = array.indexOf(key); if(index === -1) return; array.splice(index, 1); removeAll(array,key); )

Prototype method

Array.prototype.removeAll = function(key)( var index = this.indexOf(key); if(index === -1) return; this.splice(index, 1); this.removeAll(key); )

Array.prototype.removeItem = function(a) ( for (i = 0; i< this.length; i++) { if (this[i] == a) { for (i2 = i; i2 < this.length - 1; i2++) { this = this; } this.length = this.length - 1 return; } } } var recentMovies = ["Iron Man", "Batman", "Superman", "Spiderman"]; recentMovies.removeItem("Superman");