Question: I have a simple list of users

```
const [users, setUsers] = useState([
    { name: 'john', order: 0 },
    { name: 'mary', order: 1 },
    { name: 'Lou', order: 200 }
]);

```

I want to set order = 40 to the first element and order = 12 to the second element in the same operation

```
setUsers(...users, ?, ?)

```

Answer: 
You can make use of setState callback and array destructuring to update your state

```
const [users, setUsers] = useState([
  { name: "john", order: 0 },
  { name: "mary", order: 1 },
  { name: "Lou", order: 200 }
]);

setUsers(([first, second, ...rest]) => [
  { ...first, order: 40 },
  { ...second, order: 12 },
  ...rest
]);

```
Since React's state should be immutable, you would need to do deep cloning (either through a library such as **lodash**, or manually).

I recommend using [Immer](https://github.com/immerjs/immer) which not only makes things easier, but also is much more efficient than creating deep clones:

```js
import produce from "immer";

const [users, setUsers] = useState([
    { name: 'john', order: 0 },
    { name: 'mary', order: 1 },
    { name: 'Lou', order: 200 }
]);

setUsers(produce(users, draftUsers => {
    draftUsers[0].order = 12;
    draftUsers[1].order = 40;
});

```

Voilà, the beauty of this is that the object `Lou` remains unchanged, hence internally, `immer` won't recreate it.

Be careful to avoid *shallow* cloning:

```js
const newUsers = [...users];  // new copies of the user objects... right?

newUsers[0].order = 12 ;
console.log(users[0].order);  // -> 12 <-  oops! We mutated the state >_<

```