]>
Commit | Line | Data |
---|---|---|
8f9d1d4d DC |
1 | --- |
2 | title: id-length | |
8f9d1d4d DC |
3 | rule_type: suggestion |
4 | related_rules: | |
5 | - max-len | |
6 | - new-cap | |
7 | - func-names | |
8 | - camelcase | |
9 | --- | |
10 | ||
eb39fafa DC |
11 | |
12 | Very short identifier names like `e`, `x`, `_t` or very long ones like `hashGeneratorResultOutputContainerObject` can make code harder to read and potentially less maintainable. To prevent this, one may enforce a minimum and/or maximum identifier length. | |
13 | ||
14 | ```js | |
15 | var x = 5; // too short; difficult to understand its purpose without context | |
16 | ``` | |
17 | ||
18 | ## Rule Details | |
19 | ||
20 | This rule enforces a minimum and/or maximum identifier length convention. | |
21 | ||
f2a92ac6 DC |
22 | This rule counts [graphemes](https://unicode.org/reports/tr29/#Default_Grapheme_Cluster_Table) instead of using [`String length`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/length). |
23 | ||
eb39fafa DC |
24 | ## Options |
25 | ||
26 | Examples of **incorrect** code for this rule with the default options: | |
27 | ||
8f9d1d4d DC |
28 | ::: incorrect |
29 | ||
eb39fafa DC |
30 | ```js |
31 | /*eslint id-length: "error"*/ // default is minimum 2-chars ({ "min": 2 }) | |
32 | /*eslint-env es6*/ | |
33 | ||
34 | var x = 5; | |
35 | obj.e = document.body; | |
36 | var foo = function (e) { }; | |
37 | try { | |
38 | dangerousStuff(); | |
39 | } catch (e) { | |
40 | // ignore as many do | |
41 | } | |
42 | var myObj = { a: 1 }; | |
43 | (a) => { a * a }; | |
44 | class x { } | |
45 | class Foo { x() {} } | |
609c276f TL |
46 | class Foo { #x() {} } |
47 | class Foo { x = 1 } | |
48 | class Foo { #x = 1 } | |
eb39fafa DC |
49 | function foo(...x) { } |
50 | function foo([x]) { } | |
51 | var [x] = arr; | |
52 | var { prop: [x]} = {}; | |
53 | function foo({x}) { } | |
54 | var { x } = {}; | |
55 | var { prop: a} = {}; | |
56 | ({ prop: obj.x } = {}); | |
57 | ``` | |
58 | ||
8f9d1d4d DC |
59 | ::: |
60 | ||
eb39fafa DC |
61 | Examples of **correct** code for this rule with the default options: |
62 | ||
8f9d1d4d DC |
63 | ::: correct |
64 | ||
eb39fafa DC |
65 | ```js |
66 | /*eslint id-length: "error"*/ // default is minimum 2-chars ({ "min": 2 }) | |
67 | /*eslint-env es6*/ | |
68 | ||
69 | var num = 5; | |
70 | function _f() { return 42; } | |
71 | function _func() { return 42; } | |
72 | obj.el = document.body; | |
73 | var foo = function (evt) { /* do stuff */ }; | |
74 | try { | |
75 | dangerousStuff(); | |
76 | } catch (error) { | |
77 | // ignore as many do | |
78 | } | |
79 | var myObj = { apple: 1 }; | |
80 | (num) => { num * num }; | |
81 | function foo(num = 0) { } | |
82 | class MyClass { } | |
83 | class Foo { method() {} } | |
609c276f TL |
84 | class Foo { #method() {} } |
85 | class Foo { field = 1 } | |
86 | class Foo { #field = 1 } | |
eb39fafa DC |
87 | function foo(...args) { } |
88 | function foo([longName]) { } | |
89 | var { prop } = {}; | |
90 | var { prop: [longName] } = {}; | |
91 | var [longName] = arr; | |
92 | function foo({ prop }) { } | |
93 | function foo({ a: prop }) { } | |
94 | var { prop } = {}; | |
95 | var { a: prop } = {}; | |
96 | ({ prop: obj.longName } = {}); | |
97 | var data = { "x": 1 }; // excused because of quotes | |
98 | data["y"] = 3; // excused because of calculated property access | |
99 | ``` | |
100 | ||
8f9d1d4d DC |
101 | ::: |
102 | ||
eb39fafa DC |
103 | This rule has an object option: |
104 | ||
105 | * `"min"` (default: 2) enforces a minimum identifier length | |
106 | * `"max"` (default: Infinity) enforces a maximum identifier length | |
107 | * `"properties": always` (default) enforces identifier length convention for property names | |
108 | * `"properties": never` ignores identifier length convention for property names | |
109 | * `"exceptions"` allows an array of specified identifier names | |
6f036462 | 110 | * `"exceptionPatterns"` array of strings representing regular expression patterns, allows identifiers that match any of the patterns. |
eb39fafa DC |
111 | |
112 | ### min | |
113 | ||
114 | Examples of **incorrect** code for this rule with the `{ "min": 4 }` option: | |
115 | ||
8f9d1d4d DC |
116 | ::: incorrect |
117 | ||
eb39fafa DC |
118 | ```js |
119 | /*eslint id-length: ["error", { "min": 4 }]*/ | |
120 | /*eslint-env es6*/ | |
121 | ||
122 | var val = 5; | |
123 | obj.e = document.body; | |
124 | function foo (e) { }; | |
125 | try { | |
126 | dangerousStuff(); | |
127 | } catch (e) { | |
128 | // ignore as many do | |
129 | } | |
130 | var myObj = { a: 1 }; | |
131 | (val) => { val * val }; | |
132 | class x { } | |
133 | class Foo { x() {} } | |
134 | function foo(...x) { } | |
135 | var { x } = {}; | |
136 | var { prop: a} = {}; | |
137 | var [x] = arr; | |
138 | var { prop: [x]} = {}; | |
139 | ({ prop: obj.x } = {}); | |
140 | ``` | |
141 | ||
8f9d1d4d DC |
142 | ::: |
143 | ||
eb39fafa DC |
144 | Examples of **correct** code for this rule with the `{ "min": 4 }` option: |
145 | ||
8f9d1d4d DC |
146 | ::: correct |
147 | ||
eb39fafa DC |
148 | ```js |
149 | /*eslint id-length: ["error", { "min": 4 }]*/ | |
150 | /*eslint-env es6*/ | |
151 | ||
152 | var value = 5; | |
153 | function func() { return 42; } | |
154 | obj.element = document.body; | |
155 | var foobar = function (event) { /* do stuff */ }; | |
156 | try { | |
157 | dangerousStuff(); | |
158 | } catch (error) { | |
159 | // ignore as many do | |
160 | } | |
161 | var myObj = { apple: 1 }; | |
162 | (value) => { value * value }; | |
163 | function foobar(value = 0) { } | |
164 | class MyClass { } | |
165 | class Foobar { method() {} } | |
166 | function foobar(...args) { } | |
167 | var { prop } = {}; | |
168 | var [longName] = foo; | |
169 | var { a: [prop] } = {}; | |
170 | var { a: longName } = {}; | |
171 | ({ prop: obj.name } = {}); | |
172 | var data = { "x": 1 }; // excused because of quotes | |
173 | data["y"] = 3; // excused because of calculated property access | |
174 | ``` | |
175 | ||
8f9d1d4d DC |
176 | ::: |
177 | ||
eb39fafa DC |
178 | ### max |
179 | ||
180 | Examples of **incorrect** code for this rule with the `{ "max": 10 }` option: | |
181 | ||
8f9d1d4d DC |
182 | ::: incorrect |
183 | ||
eb39fafa DC |
184 | ```js |
185 | /*eslint id-length: ["error", { "max": 10 }]*/ | |
186 | /*eslint-env es6*/ | |
187 | ||
188 | var reallyLongVarName = 5; | |
189 | function reallyLongFuncName() { return 42; } | |
190 | obj.reallyLongPropName = document.body; | |
191 | var foo = function (reallyLongArgName) { /* do stuff */ }; | |
192 | try { | |
193 | dangerousStuff(); | |
194 | } catch (reallyLongErrorName) { | |
195 | // ignore as many do | |
196 | } | |
197 | (reallyLongArgName) => { return !reallyLongArgName; }; | |
198 | var [reallyLongFirstElementName] = arr; | |
199 | ``` | |
200 | ||
8f9d1d4d DC |
201 | ::: |
202 | ||
eb39fafa DC |
203 | Examples of **correct** code for this rule with the `{ "max": 10 }` option: |
204 | ||
8f9d1d4d DC |
205 | ::: correct |
206 | ||
eb39fafa DC |
207 | ```js |
208 | /*eslint id-length: ["error", { "max": 10 }]*/ | |
209 | /*eslint-env es6*/ | |
210 | ||
211 | var varName = 5; | |
212 | function funcName() { return 42; } | |
213 | obj.propName = document.body; | |
214 | var foo = function (arg) { /* do stuff */ }; | |
215 | try { | |
216 | dangerousStuff(); | |
217 | } catch (error) { | |
218 | // ignore as many do | |
219 | } | |
220 | (arg) => { return !arg; }; | |
221 | var [first] = arr; | |
222 | ``` | |
223 | ||
8f9d1d4d DC |
224 | ::: |
225 | ||
eb39fafa DC |
226 | ### properties |
227 | ||
228 | Examples of **correct** code for this rule with the `{ "properties": "never" }` option: | |
229 | ||
8f9d1d4d DC |
230 | ::: correct |
231 | ||
eb39fafa DC |
232 | ```js |
233 | /*eslint id-length: ["error", { "properties": "never" }]*/ | |
234 | /*eslint-env es6*/ | |
235 | ||
236 | var myObj = { a: 1 }; | |
237 | ({ a: obj.x.y.z } = {}); | |
238 | ({ prop: obj.i } = {}); | |
239 | ``` | |
240 | ||
8f9d1d4d DC |
241 | ::: |
242 | ||
eb39fafa DC |
243 | ### exceptions |
244 | ||
245 | Examples of additional **correct** code for this rule with the `{ "exceptions": ["x"] }` option: | |
246 | ||
8f9d1d4d DC |
247 | ::: correct |
248 | ||
eb39fafa DC |
249 | ```js |
250 | /*eslint id-length: ["error", { "exceptions": ["x"] }]*/ | |
251 | /*eslint-env es6*/ | |
252 | ||
253 | var x = 5; | |
254 | function x() { return 42; } | |
255 | obj.x = document.body; | |
256 | var foo = function (x) { /* do stuff */ }; | |
257 | try { | |
258 | dangerousStuff(); | |
259 | } catch (x) { | |
260 | // ignore as many do | |
261 | } | |
262 | (x) => { return x * x; }; | |
263 | var [x] = arr; | |
264 | const { x } = foo; | |
265 | const { a: x } = foo; | |
266 | ``` | |
267 | ||
8f9d1d4d DC |
268 | ::: |
269 | ||
6f036462 TL |
270 | ### exceptionPatterns |
271 | ||
272 | Examples of additional **correct** code for this rule with the `{ "exceptionPatterns": ["E|S", "[x-z]"] }` option: | |
273 | ||
8f9d1d4d DC |
274 | ::: correct |
275 | ||
6f036462 TL |
276 | ```js |
277 | /*eslint id-length: ["error", { "exceptionPatterns": ["E|S", "[x-z]"] }]*/ | |
278 | /*eslint-env es6*/ | |
279 | ||
280 | var E = 5; | |
281 | function S() { return 42; } | |
282 | obj.x = document.body; | |
283 | var foo = function (x) { /* do stuff */ }; | |
284 | try { | |
285 | dangerousStuff(); | |
286 | } catch (x) { | |
287 | // ignore as many do | |
288 | } | |
289 | (y) => {return y * y}; | |
290 | var [E] = arr; | |
291 | const { y } = foo; | |
292 | const { a: z } = foo; | |
293 | ``` | |
294 | ||
8f9d1d4d | 295 | ::: |