eslint/docs/src/rules/id-length.md

   1 ---
   2 title: id-length
   3 rule_type: suggestion
   4 related_rules:
   5 - max-len
   6 - new-cap
   7 - func-names
   8 - camelcase
   9 ---
  10
  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
  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
  24 ## Options
  25
  26 Examples of **incorrect** code for this rule with the default options:
  27
  28 ::: incorrect
  29
  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() {} }
  46 class Foo { #x() {} }
  47 class Foo { x = 1 }
  48 class Foo { #x = 1 }
  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
  59 :::
  60
  61 Examples of **correct** code for this rule with the default options:
  62
  63 ::: correct
  64
  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() {} }
  84 class Foo { #method() {} }
  85 class Foo { field = 1 }
  86 class Foo { #field = 1 }
  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
 101 :::
 102
 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
 110 * `"exceptionPatterns"` array of strings representing regular expression patterns, allows identifiers that match any of the patterns.
 111
 112 ### min
 113
 114 Examples of **incorrect** code for this rule with the `{ "min": 4 }` option:
 115
 116 ::: incorrect
 117
 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
 142 :::
 143
 144 Examples of **correct** code for this rule with the `{ "min": 4 }` option:
 145
 146 ::: correct
 147
 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
 176 :::
 177
 178 ### max
 179
 180 Examples of **incorrect** code for this rule with the `{ "max": 10 }` option:
 181
 182 ::: incorrect
 183
 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
 201 :::
 202
 203 Examples of **correct** code for this rule with the `{ "max": 10 }` option:
 204
 205 ::: correct
 206
 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
 224 :::
 225
 226 ### properties
 227
 228 Examples of **correct** code for this rule with the `{ "properties": "never" }` option:
 229
 230 ::: correct
 231
 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
 241 :::
 242
 243 ### exceptions
 244
 245 Examples of additional **correct** code for this rule with the `{ "exceptions": ["x"] }` option:
 246
 247 ::: correct
 248
 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
 268 :::
 269
 270 ### exceptionPatterns
 271
 272 Examples of additional **correct** code for this rule with the `{ "exceptionPatterns": ["E|S", "[x-z]"] }` option:
 273
 274 ::: correct
 275
 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
 295 :::