Typescript object destructuring is caught by ESLint no-unused-vars rule

Question

I have an object in Typescript that I am destructuring in order to extract a partial object. However, it fails my linter check:

async someFunction(username: string): Promise<UserDTO> {
    const userEntity = await getUserByUsernameAsync(username);

    if (userEntity ) {
        const { password, ...result } = userEntity ;
        return result;
    }

    return null;
}

As you can see, the above code grabs an object and strips out some parts of the object that we don't want to return, and returns the rest of the object.

However, the linter gives a warning:

warning  'password' is assigned a value but never used      @typescript-eslint/no-unused-vars

The object destructuring is assigning passport to a value and result to another object value and passport is the one that isn't being used. How do I fix this issue in order to pass the linter?

Telmo Trooper · Accepted Answer · 2020-07-10 18:01:11Z

99

You can disable this verification for rest siblings adding "@typescript-eslint/no-unused-vars": ["error", { "ignoreRestSiblings": true }] to your list of rules in eslintrc.js.

Example:

module.exports = {
  root: true,
  parser: "@typescript-eslint/parser",
  plugins: [
    "@typescript-eslint",
  ],
  extends: [
    "plugin:@typescript-eslint/eslint-recommended",
    "plugin:@typescript-eslint/recommended"
  ],
  rules: {
    "@typescript-eslint/no-unused-vars": ["error", { "ignoreRestSiblings": true }]
  },
  settings: {
    react: {
      version: "detect"
    }
  }
};

You can also opt for disabling the linting rule for that line altogether adding this to the line above it:

// eslint-disable-next-line @typescript-eslint/no-unused-vars

edited Jul 10, 2020 at 18:01

answered Jul 10, 2020 at 17:52

Telmo Trooper

5,7942 gold badges33 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

CubanX Over a year ago

For javascript and eslint use: "no-unused-vars": ["error", { "ignoreRestSiblings": true }]

escapecharacter Over a year ago

I couldn't get this to work with "@typescript-eslint/no-unused-vars": ["error", { "varsIgnorePattern": "_", "ignoreRestSiblings": true }] ... do I have the syntax wrong?

CTS_AE Over a year ago

@escapecharacter you may need the argsIgnorePattern if you're trying to allow arguments to have underscores eslint.org/docs/rules/no-unused-vars#argsignorepattern

Violeta Over a year ago

This is not working for me either, in a spec file with typescript. I have

"@typescript-eslint/no-unused-vars": ["warn", { argsIgnorePattern: "^_", varsIgnorePattern: "^_", ignoreRestSiblings: true }]

in eslintrc.js Eslint detects the line as error: const { coordinates: _, ...inputWithoutCoordinates } = input;

CTS_AE · Accepted Answer · 2021-09-01 00:49:03Z

24

It seems now days you will need these two rules added to your .eslintrc.json.

argsIgnorePattern will allow underscore arguments in your function signatures, while varsIgnorePattern will allow underscores in destructuring.

We're using the pattern: ^_ to make sure the variable name starts with an underscore.

Example

"rules": {
  "no-unused-vars": ["error", {
    "varsIgnorePattern": "^_",
    "argsIgnorePattern": "^_"
  }]
}

Documentation

Notes

In the original question it is sufficient to utilize: "ignoreRestSiblings": true because it is in use with "rest siblings".

I would still recommend using an underscore prefix as an explicit notation. It's also worth noting that without the rest pattern, ignoreRestSiblings will not solve the problem when trying to destructure and utilizing underscore notation.

edited Sep 1, 2021 at 0:49

answered Sep 1, 2021 at 0:30

CTS_AE

15.1k9 gold badges70 silver badges69 bronze badges

1 Comment

sambecker Over a year ago

varsIgnorePattern is exactly what I was looking for!

Luke · Accepted Answer · 2020-07-10 17:54:26Z

8

You can look to either remove the linter setting using the ignoreRestSiblings or pass the entire object and then look to delete the property.

async someFunction(username: string): Promise<UserDTO> {
    const userEntity = await getUserByUsernameAsync(username);

    if (userEntity ) {
        const {...result} = userEntity;
        delete result.password;
        return result
    }
    
    return null;
}

answered Jul 10, 2020 at 17:54

Luke

5674 silver badges11 bronze badges

3 Comments

farzad Over a year ago

result is a shallow copy of userEntity and your approach will change the userEntity too

Fábio Batista Over a year ago

@farzad no it won't, the password property will be removed only from the shallow copy: replit.com/@fabiob/QuietJumpyGnudebugger

mekwall Over a year ago

If you destructure password it will be removed from result and then you don't have to use delete. I.e. const { password, ...result } = userEntity;

Attila · Accepted Answer · 2023-10-26 23:05:36Z

-1

You can do:

const { field1: _, field2: __, ...rest } = yourObject;

answered Oct 26, 2023 at 23:05

Attila

277 bronze badges

1 Comment

Airah Over a year ago

This does not provide an answer to the question. Once you have sufficient reputation you will be able to comment on any post; instead, provide answers that don't require clarification from the asker. - From Review

Collectives™ on Stack Overflow

Typescript object destructuring is caught by ESLint no-unused-vars rule

4 Answers 4

4 Comments

Example

Documentation

Notes

1 Comment

3 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

4 Comments

Example

Documentation

Notes

1 Comment

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related