Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Appearance settings

Commit 80747d2

Browse filesBrowse files
Tanujkanti4441Tanujkanti4441
authored
docs: refactor prefer-destructuring rule (#18472)
* docs: refactor prefer-destructuring rule * correct options description * update option description * update wording
1 parent f6534d1 commit 80747d2
Copy full SHA for 80747d2

File tree

Expand file treeCollapse file tree

1 file changed

+75
-93
lines changed
Filter options
Expand file treeCollapse file tree

1 file changed

+75
-93
lines changed

‎docs/src/rules/prefer-destructuring.md

Copy file name to clipboardExpand all lines: docs/src/rules/prefer-destructuring.md
+75-93Lines changed: 75 additions & 93 deletions
Original file line numberDiff line numberDiff line change
@@ -14,22 +14,30 @@ With JavaScript ES6, a new syntax was added for creating variables from an array
1414

1515
### Options
1616

17-
This rule takes two sets of configuration objects. The first object parameter determines what types of destructuring the rule applies to.
17+
This rule takes two arguments, both of which are objects. The first object parameter determines what types of destructuring the rule applies to.
1818

19-
The two properties, `array` and `object`, can be used to turn on or off the destructuring requirement for each of those types independently. By default, both are true.
19+
In the first object, there are two properties, `array` and `object`, that can be used to turn on or off the destructuring requirement for each of those types independently. By default, both are true.
2020

21-
Alternatively, you can use separate configurations for different assignment types. It accepts 2 other keys instead of `array` and `object`.
22-
23-
One key is `VariableDeclarator` and the other is `AssignmentExpression`, which can be used to control the destructuring requirement for each of those types independently. Each property accepts an object that accepts two properties, `array` and `object`, which can be used to control the destructuring requirement for each of `array` and `object` independently for variable declarations and assignment expressions. By default, `array` and `object` are set to true for both `VariableDeclarator` and `AssignmentExpression`.
24-
25-
The rule has a second object with a single key, `enforceForRenamedProperties`, which determines whether the `object` destructuring applies to renamed variables.
26-
27-
**Note**: It is not possible to determine if a variable will be referring to an object or an array at runtime. This rule therefore guesses the assignment type by checking whether the key being accessed is an integer. This can lead to the following possibly confusing situations:
21+
```json
22+
{
23+
"rules": {
24+
"prefer-destructuring": ["error", {
25+
"array": true,
26+
"object": true
27+
}]
28+
}
29+
}
30+
```
2831

29-
* Accessing an object property whose key is an integer will fall under the category `array` destructuring.
30-
* Accessing an array element through a computed index will fall under the category `object` destructuring.
32+
For example, the following configuration enforces only object destructuring, but not array destructuring:
3133

32-
The `--fix` option on the command line fixes only problems reported in variable declarations, and among them only those that fall under the category `object` destructuring. Furthermore, the name of the declared variable has to be the same as the name used for non-computed member access in the initializer. For example, `var foo = object.foo` can be automatically fixed by this rule. Problems that involve computed member access (e.g., `var foo = object[foo]`) or renamed properties (e.g., `var foo = object.bar`) are not automatically fixed.
34+
```json
35+
{
36+
"rules": {
37+
"prefer-destructuring": ["error", {"object": true, "array": false}]
38+
}
39+
}
40+
```
3341

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

@@ -73,138 +81,112 @@ let bar;
7381

7482
:::
7583

76-
Examples of **incorrect** code when `enforceForRenamedProperties` is enabled:
84+
Alternatively, you can use separate configurations for different assignment types. The first argument accepts two other keys instead of `array` and `object`.
7785

78-
::: incorrect
86+
One key is `VariableDeclarator` and the other is `AssignmentExpression`, which can be used to control the destructuring requirement for each of those types independently. Each property is an object containing two properties, `array` and `object`, which can be used to control the destructuring requirement for each of `array` and `object` independently for variable declarations and assignment expressions. By default, `array` and `object` are set to `true` for both `VariableDeclarator` and `AssignmentExpression`.
7987

80-
```javascript
81-
/* eslint "prefer-destructuring": ["error", { "object": true }, { "enforceForRenamedProperties": true }] */
82-
var foo = object.bar;
88+
```json
89+
{
90+
"rules": {
91+
"prefer-destructuring": ["error", {
92+
"VariableDeclarator": {
93+
"array": true,
94+
"object": true
95+
},
96+
"AssignmentExpression": {
97+
"array": true,
98+
"object": true
99+
}
100+
}]
101+
}
102+
}
83103
```
84104

85-
:::
86-
87-
Examples of **correct** code when `enforceForRenamedProperties` is enabled:
105+
Examples of **correct** code when object destructuring in `VariableDeclarator` is enforced:
88106

89107
::: correct
90108

91109
```javascript
92-
/* eslint "prefer-destructuring": ["error", { "object": true }, { "enforceForRenamedProperties": true }] */
93-
var { bar: foo } = object;
110+
/* eslint prefer-destructuring: ["error", {VariableDeclarator: {object: true}}] */
111+
var {bar: foo} = object;
94112
```
95113

96114
:::
97115

98-
Examples of additional **correct** code when `enforceForRenamedProperties` is enabled:
116+
Examples of **correct** code when array destructuring in `AssignmentExpression` is enforced:
99117

100118
::: correct
101119

102120
```javascript
103-
/* eslint "prefer-destructuring": ["error", { "object": true }, { "enforceForRenamedProperties": true }] */
104-
class C {
105-
#x;
106-
foo() {
107-
const bar = this.#x; // private identifiers are not allowed in destructuring
108-
}
109-
}
121+
/* eslint prefer-destructuring: ["error", {AssignmentExpression: {array: true}}] */
122+
[bar] = array;
110123
```
111124

112125
:::
113126

114-
An example configuration, with the defaults `array` and `object` filled in, looks like this:
127+
#### enforceForRenamedProperties
128+
129+
The rule has a second object argument with a single key, `enforceForRenamedProperties`, which determines whether the `object` destructuring applies to renamed variables.
115130

116131
```json
117132
{
118133
"rules": {
119-
"prefer-destructuring": ["error", {
120-
"array": true,
134+
"prefer-destructuring": ["error",
135+
{
121136
"object": true
122-
}, {
123-
"enforceForRenamedProperties": false
137+
},
138+
{
139+
"enforceForRenamedProperties": true
124140
}]
125141
}
126142
}
127143
```
128144

129-
The two properties, `array` and `object`, which can be used to turn on or off the destructuring requirement for each of those types independently. By default, both are true.
130-
131-
For example, the following configuration enforces only object destructuring, but not array destructuring:
132-
133-
```json
134-
{
135-
"rules": {
136-
"prefer-destructuring": ["error", {"object": true, "array": false}]
137-
}
138-
}
139-
```
145+
Examples of **incorrect** code when `enforceForRenamedProperties` is enabled:
140146

141-
An example configuration, with the defaults `VariableDeclarator` and `AssignmentExpression` filled in, looks like this:
147+
::: incorrect
142148

143-
```json
144-
{
145-
"rules": {
146-
"prefer-destructuring": ["error", {
147-
"VariableDeclarator": {
148-
"array": false,
149-
"object": true
150-
},
151-
"AssignmentExpression": {
152-
"array": true,
153-
"object": true
154-
}
155-
}, {
156-
"enforceForRenamedProperties": false
157-
}]
158-
}
159-
}
149+
```javascript
150+
/* eslint "prefer-destructuring": ["error", { "object": true }, { "enforceForRenamedProperties": true }] */
151+
var foo = object.bar;
160152
```
161153

162-
The two properties, `VariableDeclarator` and `AssignmentExpression`, which can be used to turn on or off the destructuring requirement for `array` and `object`. By default, all values are true.
163-
164-
For example, the following configuration enforces object destructuring in variable declarations and enforces array destructuring in assignment expressions.
165-
166-
```json
167-
{
168-
"rules": {
169-
"prefer-destructuring": ["error", {
170-
"VariableDeclarator": {
171-
"array": false,
172-
"object": true
173-
},
174-
"AssignmentExpression": {
175-
"array": true,
176-
"object": false
177-
}
178-
}, {
179-
"enforceForRenamedProperties": false
180-
}]
181-
}
182-
}
183-
184-
```
154+
:::
185155

186-
Examples of **correct** code when object destructuring in `VariableDeclarator` is enforced:
156+
Examples of **correct** code when `enforceForRenamedProperties` is enabled:
187157

188158
::: correct
189159

190160
```javascript
191-
/* eslint prefer-destructuring: ["error", {VariableDeclarator: {object: true}}] */
192-
var {bar: foo} = object;
161+
/* eslint "prefer-destructuring": ["error", { "object": true }, { "enforceForRenamedProperties": true }] */
162+
var { bar: foo } = object;
193163
```
194164

195165
:::
196166

197-
Examples of **correct** code when array destructuring in `AssignmentExpression` is enforced:
167+
Examples of additional **correct** code when `enforceForRenamedProperties` is enabled:
198168

199169
::: correct
200170

201171
```javascript
202-
/* eslint prefer-destructuring: ["error", {AssignmentExpression: {array: true}}] */
203-
[bar] = array;
172+
/* eslint "prefer-destructuring": ["error", { "object": true }, { "enforceForRenamedProperties": true }] */
173+
class C {
174+
#x;
175+
foo() {
176+
const bar = this.#x; // private identifiers are not allowed in destructuring
177+
}
178+
}
204179
```
205180

206181
:::
207182

183+
**Note**: It is not possible to determine if a variable will be referring to an object or an array at runtime. This rule therefore guesses the assignment type by checking whether the key being accessed is an integer. This can lead to the following possibly confusing situations:
184+
185+
* Accessing an object property whose key is an integer will fall under the category `array` destructuring.
186+
* Accessing an array element through a computed index will fall under the category `object` destructuring.
187+
188+
The `--fix` option on the command line fixes only problems reported in variable declarations, and among them only those that fall under the category `object` destructuring. Furthermore, the name of the declared variable has to be the same as the name used for non-computed member access in the initializer. For example, `var foo = object.foo` can be automatically fixed by this rule. Problems that involve computed member access (e.g., `var foo = object[foo]`) or renamed properties (e.g., `var foo = object.bar`) are not automatically fixed.
189+
208190
## When Not To Use It
209191

210192
If you want to be able to access array indices or object properties directly, you can either configure the rule to your tastes or disable the rule entirely.

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.