How to get arrays on javascript client?

Hey guys!

I just started working with Colysus and liked it a lot!
But there is something I can't understand yet...

This is my Player class:

import { Schema, type } from '@colyseus/schema';

class PlayerState extends Schema {
  @type('number') level: number = 0;
  @type('number') timer: number = 300;
  @type('number') points: number = 0;
  @type('number') errors: number = 0;
  @type('boolean') error: boolean = false;
}

class GameState extends Schema {
  @type(['number'])
  game: number[] = [];
}

export class Player extends Schema {
  @type('string')
  sessionId: string;

  @type('string')
  name: string;

  @type(PlayerState)
  state: PlayerState = new PlayerState();

  @type(GameState)
  gameState: GameState = new GameState();
}

When I listen to changes on PlayerState, for example, it's ok I get the information:

player.state.onChange = (changes) => {
    changes.forEach((c) => {
      this.players[this.getPlayerIndex(key)].state[c.field] = c.value;
    });
};
[{op: 128, field: "level", dynamicIndex: undefined, value: 0, previousValue: undefined},
{op: 128, field: "timer", dynamicIndex: undefined, value: 300, previousValue: undefined},
{op: 128, field: "points", dynamicIndex: undefined, value: 0, previousValue: undefined},
{op: 128, field: "errors", dynamicIndex: undefined, value: 0, previousValue: undefined},
{op: 128, field: "error", dynamicIndex: undefined, value: false, previousValue: undefined}]

But when get the information from GameState ('game' wich is an array) I get this:

[{op: 128, field: "game", dynamicIndex: undefined, value: Proxy, previousValue: undefined}]
Proxy {$changes: ChangeTree, $items: Map(16), $indexes: Map(16), $refId: 0, $proxy: true}

How can I deal with this 'Proxy'?
I've tried a lot of stuff and nothing works...
I would like to understand how to read it, get the original array from this and get the changes.

Thanks in advance!

Hi @leal32b, glad you're enjoying using Colyseus so far!

Arrays are accessible on the client-side via a Proxy - you can expect them to have exactly the same methods from a JavaScript Array object, which you can see the documentation here: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array

If you'd like to debug the values from the array, you can use console.log(Array.from(proxy)). You can access and manipulate the Proxy instance just like a regular though, it just does not print properly via console.log().

Docs about the ArraySchema can be found here as well: https://docs.colyseus.io/state/schema/#arrayschema

@endel said in How to get arrays on javascript client?:

console.log(Array.from(proxy))

Thanks a lot, endel!! Worked perfectly!
Colyseus rocks! xD