check if two arrays contain identical objects - react componentDidUpdate [duplicate]

Question

I am using React's componentDidUpdate lifecycle method.

I am trying to determine whether or not two arrays are the same.

My prevState array looks like this:

prevState.players = [
  {
    name: 'Wayne Rooney',
    age: 31
  }, 
  {
    name: 'Lionel Messi',
    age: 29
  },
  {
    name: 'Robbie Fowler',
    age: 42
  }
];

and the this.state array looks like this:

this.state.players = [
  {
    name: 'Wayne Rooney',
    age: 31
  }, 
  {
    name: 'Lionel Messi',
    age: 29
  },
  {
    name: 'Robbie Fowler',
    age: 42
  }
];

As you can see if you expand the snippet below they are not equal:

let playersOne = [{
    name: 'Wayne Rooney',
    age: 31
  },
  {
    name: 'Lionel Messi',
    age: 29
  },
  {
    name: 'Robbie Fowler',
    age: 42
  }
];

let playersTwo = [{
    name: 'Wayne Rooney',
    age: 31
  },
  {
    name: 'Lionel Messi',
    age: 29
  },
  {
    name: 'Robbie Fowler',
    age: 42
  }
];

console.log(playersOne == playersTwo)

And here is my react lifecycle code.

  componentDidUpdate(prevProps, prevState) {
    if(prevState.players != this.state.players) {
      this.updatePlayers(this.state);
    }
  }

can anyone advise as to the best way to determine if the arrays are equal?

Answer 1

JSON.stringify(playersOne) == JSON.stringify(playersTwo)

Answer 2

You can use array.prototype.every :

var players = [
  { name: 'Wayne Rooney'  , age: 31 }, 
  { name: 'Lionel Messi'  , age: 29 },
  { name: 'Robbie Fowler' , age: 42 }
];

var statePlayers = [
  { name: 'Wayne Rooney'  , age: 31 }, 
  { name: 'Lionel Messi'  , age: 29 },
  { name: 'Robbie Fowler' , age: 42 }
];

var equals = players.length === statePlayers.length && players.every((e, i) => e.name === statePlayers[i].name && e.age === statePlayers[i].age);

console.log(equals);

Alternatively, using object destructuring and Array.prototype.some.

const
  players = [
    { name: 'Wayne Rooney'  , age: 31 }, 
    { name: 'Lionel Messi'  , age: 29 },
    { name: 'Robbie Fowler' , age: 42 }
  ],
  statePlayers = [
    { name: 'Wayne Rooney'  , age: 31 }, 
    { name: 'Lionel Messi'  , age: 29 },
    { name: 'Robbie Fowler' , age: 42 }
  ],
  playersEqual = (expected, actual) =>
    actual.length === expected.length &&
      !expected.some(({ name, age }, i) =>
        (({ name: otherName, age: otherAge }) =>
          name !== otherName || age !== otherAge)
        (actual[i]));

console.log(playersEqual(players, statePlayers));