1

I have this Array:

var sizes = [
        [20, 10, 0],
        [40, 20, 0],
        [60, 30, 0],
        [80, 40, 0],
        [100, 50, 0]
        ];

I want to randomly change the size of rectangle to to the sizes: (20, 10) or (40, 20) or (60, 30) or (80, 40) or (100, 50) and I change the X Position(this does not to seem part of my Problem)

Every Size can only be displayed a maximum of 10 times. I save the counter of the size in the 3rd column of the Array. And when it counts 10 I want to delete this size of the possible sizes, so it can't be changed to this size again. Also this should limit the changes to a maximum of 50 times.

My Code to randomly change the rectangle looks like this:

function changeRec() {

        if (sizes.length == 0) {
            return;
        }

        var rnd = Math.round(Math.random() * (sizes.length -1 ));

        var x = sizes[rnd][0];
        var y = sizes[rnd][1];

        var element = document.getElementById("rectangle");

        element.style.width = x + "px";
        element.style.height = y + "px";

        var newX = (Math.random() * (document.body.clientWidth -200));
        var rect = element.getBoundingClientRect();
        if (Math.abs(newX - rect.left) < 30) {
            changeRec();
        } else {
            element.style.left = newX+"px";
            sizes[rnd][2]++;

            if (sizes[rnd][2] == 10) {
                delete sizes[rnd];
                console.log("deleted");
            }

            count++;
            calculate();
        }           
    }

However this code does not seem to work properly. I don't really know why but It seems like the removing from an index of the sizes array does not work.

I get the Error: TypeError: undefined is not an object (evaluating 'sizes[rnd][0]')

Jonas
  • 3,953
  • 4
  • 24
  • 64
  • 1
    To get a random index in an array use `Math.floor(Math.random() * sizes.length)`. Your code can return `rnd = -1`. – Barmar Jun 01 '18 at 10:57
  • @Barmar it'd never return `rnd = -1` because of `if (sizes.length == 0)` – Bunyamin Coskuner Jun 01 '18 at 11:01
  • @BunyaminCoskuner Good point. But it's somehow returning an index outside the array. If he does it the normal way it should work. – Barmar Jun 01 '18 at 11:04
  • Seems like problem after deleting the element of array. After deleting you will have undefined element in this position – Sabik Jun 01 '18 at 11:06
  • @Barmar it is not about getting a random value. It's about deleting one. The question you pointed out is not a solution to this one. It should be this one https://stackoverflow.com/questions/5767325/how-do-i-remove-a-particular-element-from-an-array-in-javascript – Bunyamin Coskuner Jun 01 '18 at 11:07
  • Ahh, I see now. He's doing `delete sizes[rnd];` The next time it picks that `rnd`, it gets an error. – Barmar Jun 01 '18 at 11:09

1 Answers1

3

delete sizes[rnd] will not shrink your array by one, instead it'll give you an empty element. Therefore, when you hit that index second time, it'll throw an error.

To remove an item from an array you should use splice.

Change

delete sizes[rnd]

to

sizes.splice(rnd, 1)

Bunyamin Coskuner
  • 7,831
  • 1
  • 23
  • 43