---
url: /docs/guide/usage/linter/rules/eslint/prefer-destructuring.md
---

### What it does

Require destructuring from arrays and/or objects.

### Why is this bad?

With JavaScript ES2015, a new syntax was added for creating variables from an array index or object property,
called destructuring. This rule enforces usage of destructuring
instead of accessing a property through a member expression.

### Examples

Examples of **incorrect** code for this rule:

```js
// With `array` enabled
const foo = array[0];
bar.baz = array[0];
// With `object` enabled
const qux = object.qux;
const quux = object["quux"];
```

Examples of **correct** code for this rule:

```js
// With `array` enabled
const [foo] = array;
const arr = array[someIndex];
[bar.baz] = array;

// With `object` enabled
const { baz } = object;
const obj = object.bar;
```

## Configuration

### The 1st option

This option is an object with the following properties:

#### array

type: `boolean`

#### object

type: `boolean`

### The 2nd option

This option is an object with the following properties:

#### enforceForDeclarationWithTypeAnnotation

type: `boolean`

default: `false`

#### enforceForRenamedProperties

type: `boolean`

default: `false`

## How to use

## Version

This rule was added in v1.10.0.

## References