# Very long class code

**URL:** <https://discourse.processing.org/t/very-long-class-code/26599>\
**Category:** Coding Questions\
**Created:** [December 29, 2020, 9:49pm UTC](https://discourse.processing.org/t/very-long-class-code/26599 "2020-12-29T21:49:33Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![olaf000olaf](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/olaf000olaf/32/11295_2.png) [@olaf000olaf](https://discourse.processing.org/u/olaf000olaf)\
**Post date:** [December 29, 2020, 9:49pm UTC](https://discourse.processing.org/t/very-long-class-code/26599/1 "2020-12-29T21:49:33Z")

</div>

I want to connect every point with a line using a neighbor system, and I’m using a lot of class variables that don’t work. I don’t know if there is a limit but here’s the code: [https://www.openprocessing.org/sketch/1050682](https://www.openprocessing.org/sketch/1050682)  
line 62  
Can someone help me figure out why it doesn’t work?

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [December 29, 2020, 10:10pm UTC](https://discourse.processing.org/t/very-long-class-code/26599/2 "2020-12-29T22:10:41Z")

</div>

> [@olaf000olaf](#):
>
> Can someone help me figure out why it doesn’t work?

When you instantiate your _net[][]_ 2D array within **setup()** the order is _y_ & _x_. 🥅

But for unknown reasons within **draw()** you choose to iterate over _net[][]_ by _x_ & _y_ order instead! 😲

Anyways, I’ve refactored your triple loop within callback **draw()** for more clarity: ➿

```javascript
function draw() {
  background(255);

  for (const row of net)
    for (const { x, y, neighbors } of row)
      for (const { x: nx, y: ny } of neighbors)
        line(x, y, nx, ny);
}

```

---

<div class="post-metadata">

**Author:** ![olaf000olaf](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/olaf000olaf/32/11295_2.png) [@olaf000olaf](https://discourse.processing.org/u/olaf000olaf)\
**Post date:** [December 29, 2020, 10:21pm UTC](https://discourse.processing.org/t/very-long-class-code/26599/3 "2020-12-29T22:21:40Z")

</div>

> [@GoToLoop](#):
>
> When you instantiate your _net[][]_ 2D array within **setup()** the order is _y_ & _x_ . 🥅

I don’t think I did, when i create a new point I put it in x y order and it still renders correctly, will check the code bellow.

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [December 29, 2020, 10:25pm UTC](https://discourse.processing.org/t/very-long-class-code/26599/4 "2020-12-29T22:25:48Z")

</div>

> [@olaf000olaf](#):
>
> I don’t think I did,

This is your double loop within callback **setup()**:

```auto
	for(y = 0; y < ace.height; y = y + 1){
		for(x = 0; x < ace.width; x = x + 1){

```

And this is your double loop within callback **draw()**:

```auto
	for(x = 0; x < cols; x = x + 1){
		for(y = 0; y < rows; y = y + 1){

```

Their order is clearly swapped! 😬

---

<div class="post-metadata">

**Author:** ![olaf000olaf](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/olaf000olaf/32/11295_2.png) [@olaf000olaf](https://discourse.processing.org/u/olaf000olaf)\
**Post date:** [December 29, 2020, 10:27pm UTC](https://discourse.processing.org/t/very-long-class-code/26599/5 "2020-12-29T22:27:19Z")

</div>

oh there, will it matter though?

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [December 29, 2020, 10:34pm UTC](https://discourse.processing.org/t/very-long-class-code/26599/6 "2020-12-29T22:34:56Z")

</div>

B/c the number of rows & columns, which are based on the p5.Image’s _height_ & _width_ properties, aren’t the same.

Therefore you end up accessing indices outta range b/c the number of rows is less than the number of columns for _net[][]_.

BtW, my refactored loop version doesn’t care about the order the 2D array was created. 😉

---

<div class="post-metadata">

**Author:** ![olaf000olaf](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/olaf000olaf/32/11295_2.png) [@olaf000olaf](https://discourse.processing.org/u/olaf000olaf)\
**Post date:** [December 29, 2020, 10:49pm UTC](https://discourse.processing.org/t/very-long-class-code/26599/7 "2020-12-29T22:49:32Z")

</div>

Thx, I dont fully understand how it works but it does, never worked like that. thx \<3

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [December 29, 2020, 10:53pm UTC](https://discourse.processing.org/t/very-long-class-code/26599/8 "2020-12-29T22:53:44Z")

</div>

> [@olaf000olaf](#):
>
> , I dont fully understand how it works but it does,

Read about `for..of` loop & “object destructuring assignment” on the links below: 🔗

> **[for...of - JavaScript | MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of)**
>
> The for...of statement executes a loop that operates on a sequence of values sourced from an iterable object. Iterable objects include instances of built-ins such as Array, String, TypedArray, Map, Set, NodeList (and other DOM collections), as well...

> **[Destructuring assignment - JavaScript | MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Object_destructuring)**
>
> The destructuring assignment syntax is a JavaScript expression that makes it possible to unpack values from arrays, or properties from objects, into distinct variables.
