Remove element from array, using slice

Question

I am trying to remove a element from my array using slice, but i can't get it to work, look at this piece of code.

    console.log(this.activeEffects); // Prints my array
    console.log(this.activeEffects.slice(0,1)); // Remove from index 0, and remove one.
    console.log(this.activeEffects); // Prints array again, this time my element should be gone

Result of this is.

enter image description here

So what is get from this is, at first the array is whole, as it should be. Then its prints what is sliced of the array. Finally the third should be empty? or?

it is possible to make jsfiddle for this ?

zb'
– zb'

2012-08-07 14:50:31 +00:00
Commented Aug 7, 2012 at 14:50 — zb'
– zb', Commented Aug 7, 2012 at 14:50
Are you sure this is an array?

Ashwin Prabhu
– Ashwin Prabhu

2012-08-07 14:51:52 +00:00
Commented Aug 7, 2012 at 14:51 — Ashwin Prabhu
– Ashwin Prabhu, Commented Aug 7, 2012 at 14:51

corlaez · Accepted Answer · 2017-12-10 21:40:45Z

52

function removeItemWithSlice(index) {
  return [...items.slice(0, index), ...items.slice(index + 1)]
}

Slice will create a new array. We create two arrays: from beggining to index and from index+1 to end. Then we apply the spread operator (...) to take the items of those arrays and create a new single array containing all the items we care. I will paste an equivalent way if you don't like the one liner:

function removeItemWithSlice(index) {
  const firstArr = items.slice(0, index);
  const secondArr = items.slice(index + 1);
  return [...firstArr , ...secondArr]
}

answered Dec 10, 2017 at 21:40

corlaez

1,4231 gold badge17 silver badges31 bronze badges

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

1 Comment

user22325 Over a year ago

This should be the accepted answer since it solves the literal question. Splice and Slice do not behave the same when it comes to mutation.

TSL · Accepted Answer · 2012-08-07 14:51:53Z

30

I believe you're looking for splice. From W3 Schools:

The splice() method adds/removes items to/from an array, and returns the removed item(s).

Take a look at the example on that page; the use case there is similar to what you want to achieve.

EDIT: Alternative link to MDN, as suggested by Nicosunshine; much more information about the command there.

answered Aug 7, 2012 at 14:51

TSL

9386 silver badges19 bronze badges

6 Comments

nicosantangelo Over a year ago

I know I might sound annoying, but don't use W3 Schools. MDN it's a much better resource developer.mozilla.org/en-US/docs/JavaScript/Reference/…

MartinElvar Over a year ago

Thank you TSL, this solved my problem. Slapping my self right now.

canon Over a year ago

@nicosunshine to Meta to request auto-block of w3schools links!

nicosantangelo Over a year ago

@canon I don't know if that would fly, but you can always spam w3fools.com in all stack overflow :P

Emobe Over a year ago

The OP asked for slice. There's a reason to use slice if you wish not to mutate values.

|

spirinvladimir · Accepted Answer · 2018-04-19 14:59:51Z

13

a.slice(0, index).concat(a.slice(index + 1))

answered Apr 19, 2018 at 14:59

spirinvladimir

6907 silver badges9 bronze badges

3 Comments

kingdaro Over a year ago

Instead of throwing a code snippet at OP, better to give some additional explanation, e.g. why their solution doesn't work, how yours does, and maybe link to additional documentation to the used functions in question.

spirinvladimir Over a year ago

@kingdaro My type of thinking adressed to a strong developer.

Francesco Mari Over a year ago

technically, this is the right answer - and yes, you might want to use splice instead :-)

Esailija · Accepted Answer · 2012-08-07 14:50:43Z

8

.slice does not mutate the array, you could use .splice() to remove the item at index i in the array:

this.activeEffects.splice(i, 1)

answered Aug 7, 2012 at 14:50

Esailija

140k24 gold badges280 silver badges328 bronze badges

4 Comments

MartinElvar Over a year ago

But i may need to remove a element i the middle of the array

Esailija Over a year ago

@MartinElvarJensen right, I didn't realize that. shift() is preferable when you want to remove from the beginning.

mbx-mbx Over a year ago

slice does not change the original array as he says but it does return the removed elements. Why not then replace the original array with the removed elements by doing an assignment? e.g. this.activeEffects = this.activeEffects.slice(0,1)

Esailija Over a year ago

@Magrangs you would need to reverse that. Something like: this.activeEffects = this.activeEffects.slice(1) It makes a new array that has all the items except for the first one. But if there are other references to the old array, they won't be updated.

Sardar Usama · Accepted Answer · 2016-12-17 22:13:15Z

5

This is what I was able to come up with :

var newArray = oldArray.slice(indexOfElementToRemove+1).concat(oldArray.slice(0,indexOfElementToRemove));

edited Dec 17, 2016 at 22:13

Sardar Usama

19.7k9 gold badges39 silver badges60 bronze badges

answered Dec 17, 2016 at 22:08

Chacal

511 silver badge2 bronze badges

1 Comment

tladuke Over a year ago

this changes the order of the array

Jed Fox · Accepted Answer · 2017-06-30 13:38:43Z

1

Array.prototype.slice()...

does not alter the original array, but returns a new "one level deep" copy that contains copies of the elements sliced from the original array. Elements of the original array are copied into the new array as follows:

Whereas Array.prototype.splice()...

Changes the content of an array, adding new elements while removing old elements.

This example should illustrate the difference.

// sample array
var list = ["a","b","c","d"];
// slice returns a new array
console.log("copied items: %o", list.slice(2));
// but leaves list itself unchanged
console.log("list: %o", list);
// splice modifies the array and returns a list of the removed items
console.log("removed items: %o", list.splice(2));
// list has changed
console.log("list: %o", list);

edited Jun 30, 2017 at 13:38

Jed Fox

3,0255 gold badges31 silver badges38 bronze badges

answered Aug 7, 2012 at 14:54

canon

41.9k10 gold badges77 silver badges102 bronze badges

Comments

BlackMario · Accepted Answer · 2012-08-07 14:54:08Z

-1

Look at here : http://www.w3schools.com/jsref/jsref_slice_array.asp

You can see that the slice method select object et throw them into a new array object ^^ So you can't delete an object like this, may be you can try a thing like this :

var a = ["a","b","c"]; (pseudo code)
/* I wan't to remove the "b" object */

var result = a.slice(0,1)+a.slice(2,1); /* If you considers that "+" is a concatenation operator, i don't remember if it is true... */

answered Aug 7, 2012 at 14:54

BlackMario

551 silver badge9 bronze badges

Collectives™ on Stack Overflow

Remove element from array, using slice

7 Answers 7

1 Comment

6 Comments

3 Comments

4 Comments

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

1 Comment

6 Comments

3 Comments

4 Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related