如果我根据数组特定索引中的对象分配两个变量，如何传递 eslint 的“优先解构”规则？

Question

I have array touchEvents. It looks like:

evt: {
    touchEvents: [
       {
         clientX: 3,
         clientY: 4,
       }, {...}, ...
    ]
 }

I wanted to reassign two variables to the two properties specifically in the [0] position of the array.

I did:

clientX = evt.touchEvents[0].clientX;
clientY = evt.touchEvents[0].clientY;

The eslint linter said:

error: Use object destructuring (prefer-destructuring)

So I did:

({ clientX, clientY } = evt.touchEvents[0]);

And I got the error

error: Use array destructuring (prefer-destructuring)

I don't understand how to use "array destructuring" to assign these variables. I've read the mdn docs and the eslint documentation on destructuring but I still don't understand what it wants of me, or rather, how to use array destructuring to assign these variables.

How can I use "array destructuring" to pass this eslint rule and assign my variables?

Answer 1

in two lines it would be

const [ touchEvents ] = evt.touchEvents
const { clientX, clientY } = touchEvents

or one-liners

const { clientX, clientY } = evt.touchEvents[0]

or

const [{ clientX, clientY }] = evt.touchEvents

if you feel any rule bothers you, you can always disable with // eslint-disable-next-line <the-rule-name>