Array of object - all object are equal the last one javascript

Question

I have a problem with TypeScript objects and push all of them into array and retrieve them later.

I have a history object, and pushHistory() method. Also I have also a History object. It looks like:

  public history: History[];

  pushHistory(cell, support, pad, empty, time){
    let historyObject = new History(cell, support, pad, empty, time);
    this.history.push(historyObject);    
  }

When I want retrieve any history value, for example history[X].data.cell[0][0].value it is always equal the last value. Generally it look like all History instance is the same instance, so in my history array it's only one object, always refer to the last version.

My History object look a like:

export class History {
  public cells: Cell[][];
  public support: Support[];
  public pad: Pad[];
  public empty: number;
  public lastTime: ITimer;

  constructor(cells: Cell[][], support: Support[], pad: Pad[], empty: number, lastTime: ITimer) {
    this.cells = cells;
    this.support = support;
    this.pad = pad;
    this.empty = empty;
    this.lastTime = lastTime;
  }
}

As you ask for Component code. setValue method is called from .html button click, this.cells come from Android object (form android app).

export class Componenet implements OnInit {
  @ViewChild(TimerComponent) timer: TimerComponent;

  cells: Cells[][];
  support: Support[];
  pad: Pad[];
  empty: number;
  time: ITimer;
  enumMode: enum;
  enumAction: enum;
  testValue: boolean;

  constructor(private route: ActivatedRoute, private history: HisotryService, private soundService: AudioPlayerService) {
    this.enumMode = Mode;
    this.enumAction = Action;
    this.testValue = false;
  }

  ngOnInit() {
    this.empty = 10;

    if (typeof Android != 'undefined') {
      this.cells = Android.generate();
}


    this.cells = [];
    this.pad = [];
    this.support= [];

    this.history.retriveHistoryObject(JSON.parse(localStorage.getItem('last')));
    const historyObject = this.history.getLastHistoryObject();

    this.cells = historyObject.cells;
    this.support = historyObject.support;
    this.pad = historyObject.pad;

    this.empty = historyObject.emptyCells;

    this.timerStart = historyObject.lastTime;

    setTimeout(() => {
      this.timer.startTimer();
    }, 1000);

  }


  public setValue(number, usage) {
    this.soundService.playClick();

    // CODE that maek operation on this.cells, this.pad, this.empty and so on

    this.history.pushHistory(this.cells, null, this.pad, this.empty, time);

  }
}

What is data? Are you sure that data isn't containing an instance of something that is actually shared, ie each one holding the same reference to the same object — Patrick Evans
– Patrick Evans, Commented Sep 29, 2017 at 18:32
You need to show a Minimal, Complete, and Verifiable example if you expect anyone to be able to help you. Show us how you're calling pushHistory() and what you're passing into it. — Jun Kang
– Jun Kang, Commented Sep 29, 2017 at 18:39

shevaroller · Accepted Answer · 2017-09-29 19:56:07Z

1

You can use lodash's cloneDeep. It creates a new object instance instead of referencing the same object.

import { cloneDeep } from 'lodash';

...

export class ... implements OnInit {

  ...


  public setValue() {
    ...
    const historyCopy = cloneDeep(historyObject);
    this.history.push(historyCopy);
  }
}

answered Sep 29, 2017 at 19:56

shevaroller

1037 bronze badges

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

Collectives™ on Stack Overflow

Array of object - all object are equal the last one javascript

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related