prefer-destructuring

Require destructuring from arrays and/or objects.

🔧

Some problems reported by this rule are automatically fixable by the --fix ESLint command line option.

💭

This rule requires type information to run.

Examples

This rule extends the base eslint/prefer-destructuring rule. It adds support for TypeScript's type annotations in variable declarations.

`eslint/prefer-destructuring`

const x: string = obj.x; // This is incorrect and the auto fixer provides following untyped fix.
// const { x } = obj;

Open in Playground

`@typescript-eslint/prefer-destructuring`

const x: string = obj.x; // This is correct by default. You can also forbid this by an option.

Open in Playground

And it infers binding patterns more accurately thanks to the type checker.

❌ Incorrect

const x = ['a'];
const y = x[0];

Open in Playground

✅ Correct

const x = { 0: 'a' };
const y = x[0];

Open in Playground

It is correct when enforceForRenamedProperties is not true. Valid destructuring syntax is renamed style like { 0: y } = x rather than [y] = x because x is not iterable.

How to Use

.eslintrc.cjs

module.exports = {
  "rules": {
    // Note: you must disable the base rule as it can report incorrect errors
    "prefer-destructuring": "off",
    "@typescript-eslint/prefer-destructuring": "error"
  }
};

Try this rule in the playground ↗

Options

See eslint/prefer-destructuring options.

This rule adds the following options:

type Options = [
  BasePreferDestructuringOptions[0],
  BasePreferDestructuringOptions[1] & {
    enforceForDeclarationWithTypeAnnotation?: boolean;
  },
];

const defaultOptions: Options = [
  basePreferDestructuringDefaultOptions[0],
  {
    ...basePreferDestructuringDefaultOptions[1],
    enforceForDeclarationWithTypeAnnotation: false,
  },
];

enforceForDeclarationWithTypeAnnotation

When set to true, type annotated variable declarations are enforced to use destructuring assignment.

Examples with { enforceForDeclarationWithTypeAnnotation: true }:

❌ Incorrect

const x: string = obj.x;

Open in Playground

✅ Correct

const { x }: { x: string } = obj;

Open in Playground

When Not To Use It

Type checked lint rules are more powerful than traditional lint rules, but also require configuring type checked linting. See Performance Troubleshooting if you experience performance degredations after enabling type checked rules.

Resources

• Rule source
• Test source

^{Taken with ❤️ from ESLint core.}