# P5.js Array: Multiple Objects getting Spliced instead of Single

**URL:** <https://discourse.processing.org/t/p5-js-array-multiple-objects-getting-spliced-instead-of-single/27317>\
**Category:** Coding Questions\
**Created:** [January 23, 2021, 10:54pm UTC](https://discourse.processing.org/t/p5-js-array-multiple-objects-getting-spliced-instead-of-single/27317 "2021-01-23T22:54:49Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![devalladares](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/devalladares/32/11754_2.png) [@devalladares](https://discourse.processing.org/u/devalladares)\
**Post date:** [January 23, 2021, 10:54pm UTC](https://discourse.processing.org/t/p5-js-array-multiple-objects-getting-spliced-instead-of-single/27317/1 "2021-01-23T22:54:49Z")

</div>

I’m trying to create a moving array of decorative circles, and as soon as a circle moves off the edge of the screen I would like to remove it from the array. I have tried both splicing and filtering from the array – however, as soon as I do this, _all_ the circles in the array get deleted, instead of just the intended one. Checked multiple sources and tried different thinkgs but I simply can’t figure out what’s going wrong. You can have a look at the demo here in the p5.js editor: [p5.js Web Editor](https://editor.p5js.org/devalladares/sketches/v6bWAiISM)

Main code here if it helps:

```auto
function setup() {

   //Create new Circle
   for (let i = 0; i < circleNumber; i++) {
     circles.push(new createCircle())
   }
 }

 function draw() {

   for (let i = circles.length - 1; i >= 0; i--) {

     circles[i].update(i * 200)

     //This is the problem: Simply cannot figure it out

     //Splicing

     if (circles[i].isDead()) {
       circles.splice(i, 1)
     }
   }

   //Filtering
   // circles = circles.filter(x => !x.isDead())
 }

//Class to create Circle

class createCircle {

   constructor() {
     this.circle = []
       this.origin = i * gap + emptySpace2
     this.pos = 0
     this.xPos = width / 5
     this.create()
   }

   create() {
     for (let i = 0; i < ringNumber; i++) {
       this.circle.push(new circleRing())
     }
   }

   update(dist) {

     push()
     this.xPos -= xSpeed
     this.pos = this.xPos + dist / 1.8

     translate(this.pos, this.origin / 1.15)
     scale(0.6, 0.6)

     for (let circles of this.circle) {
       circles.update()
     }
     pop()
   }

   isDead() {
     if (this.pos < 40) {
       return true;
     } else {
       return false;
     }
   }
 }

```

Thank you in advance!!

---

<div class="post-metadata">

**Author:** ![devalladares](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/devalladares/32/11754_2.png) [@devalladares](https://discourse.processing.org/u/devalladares)\
**Post date:** [January 23, 2021, 11:32pm UTC](https://discourse.processing.org/t/p5-js-array-multiple-objects-getting-spliced-instead-of-single/27317/2 "2021-01-23T23:32:11Z")

</div>

Nevermind, found it! Someone replied on stackoverflow

> <https://stackoverflow.com/questions/65865294/p5-js-array-multiple-objects-getting-spliced-instead-of-single>