eslint/docs/src/rules/no-underscore-dangle.md

   1 ---
   2 title: no-underscore-dangle
   3 layout: doc
   4 rule_type: suggestion
   5 ---
   6
   7
   8 As far as naming conventions for identifiers go, dangling underscores may be the most polarizing in JavaScript. Dangling underscores are underscores at either the beginning or end of an identifier, such as:
   9
  10 ```js
  11 var _foo;
  12 ```
  13
  14 There is actually a long history of using dangling underscores to indicate "private" members of objects in JavaScript (though JavaScript doesn't have truly private members, this convention served as a warning). This began with SpiderMonkey adding nonstandard methods such as `__defineGetter__()`. The intent with the underscores was to make it obvious that this method was special in some way. Since that time, using a single underscore prefix has become popular as a way to indicate "private" members of objects.
  15
  16 Whether or not you choose to allow dangling underscores in identifiers is purely a convention and has no effect on performance, readability, or complexity. It's purely a preference.
  17
  18 ## Rule Details
  19
  20 This rule disallows dangling underscores in identifiers.
  21
  22 Examples of **incorrect** code for this rule:
  23
  24 ::: incorrect
  25
  26 ```js
  27 /*eslint no-underscore-dangle: "error"*/
  28
  29 var foo_;
  30 var __proto__ = {};
  31 foo._bar();
  32 ```
  33
  34 :::
  35
  36 Examples of **correct** code for this rule:
  37
  38 ::: correct
  39
  40 ```js
  41 /*eslint no-underscore-dangle: "error"*/
  42
  43 var _ = require('underscore');
  44 var obj = _.contains(items, item);
  45 obj.__proto__ = {};
  46 var file = __filename;
  47 function foo(_bar) {};
  48 const foo = { onClick(_bar) {} };
  49 const foo = (_bar) => {};
  50 ```
  51
  52 :::
  53
  54 ## Options
  55
  56 This rule has an object option:
  57
  58 * `"allow"` allows specified identifiers to have dangling underscores
  59 * `"allowAfterThis": false` (default) disallows dangling underscores in members of the `this` object
  60 * `"allowAfterSuper": false` (default) disallows dangling underscores in members of the `super` object
  61 * `"allowAfterThisConstructor": false` (default) disallows dangling underscores in members of the `this.constructor` object
  62 * `"enforceInMethodNames": false` (default) allows dangling underscores in method names
  63 * `"enforceInClassFields": false` (default) allows dangling underscores in es2022 class fields names
  64 * `"allowFunctionParams": true` (default) allows dangling underscores in function parameter names
  65
  66 ### allow
  67
  68 Examples of additional **correct** code for this rule with the `{ "allow": ["foo_", "_bar"] }` option:
  69
  70 ::: correct
  71
  72 ```js
  73 /*eslint no-underscore-dangle: ["error", { "allow": ["foo_", "_bar"] }]*/
  74
  75 var foo_;
  76 foo._bar();
  77 ```
  78
  79 :::
  80
  81 ### allowAfterThis
  82
  83 Examples of **correct** code for this rule with the `{ "allowAfterThis": true }` option:
  84
  85 ::: correct
  86
  87 ```js
  88 /*eslint no-underscore-dangle: ["error", { "allowAfterThis": true }]*/
  89
  90 var a = this.foo_;
  91 this._bar();
  92 ```
  93
  94 :::
  95
  96 ### allowAfterSuper
  97
  98 Examples of **correct** code for this rule with the `{ "allowAfterSuper": true }` option:
  99
 100 ::: correct
 101
 102 ```js
 103 /*eslint no-underscore-dangle: ["error", { "allowAfterSuper": true }]*/
 104
 105 var a = super.foo_;
 106 super._bar();
 107 ```
 108
 109 :::
 110
 111 ### allowAfterThisConstructor
 112
 113 Examples of **correct** code for this rule with the `{ "allowAfterThisConstructor": true }` option:
 114
 115 ::: correct
 116
 117 ```js
 118 /*eslint no-underscore-dangle: ["error", { "allowAfterThisConstructor": true }]*/
 119
 120 var a = this.constructor.foo_;
 121 this.constructor._bar();
 122 ```
 123
 124 :::
 125
 126 ### enforceInMethodNames
 127
 128 Examples of **incorrect** code for this rule with the `{ "enforceInMethodNames": true }` option:
 129
 130 ::: incorrect
 131
 132 ```js
 133 /*eslint no-underscore-dangle: ["error", { "enforceInMethodNames": true }]*/
 134
 135 class Foo {
 136   _bar() {}
 137 }
 138
 139 class Foo {
 140   bar_() {}
 141 }
 142
 143 const o = {
 144   _bar() {}
 145 };
 146
 147 const o = {
 148   bar_() = {}
 149 };
 150 ```
 151
 152 :::
 153
 154 ### enforceInClassFields
 155
 156 Examples of **incorrect** code for this rule with the `{ "enforceInClassFields": true }` option:
 157
 158 ::: incorrect
 159
 160 ```js
 161 /*eslint no-underscore-dangle: ["error", { "enforceInClassFields": true }]*/
 162
 163 class Foo {
 164     _bar;
 165 }
 166
 167 class Foo {
 168     _bar = () => {};
 169 }
 170
 171 class Foo {
 172     bar_;
 173 }
 174
 175 class Foo {
 176     #_bar;
 177 }
 178
 179 class Foo {
 180     #bar_;
 181 }
 182 ```
 183
 184 :::
 185
 186 ### allowFunctionParams
 187
 188 Examples of **incorrect** code for this rule with the `{ "allowFunctionParams": false }` option:
 189
 190 ::: incorrect
 191
 192 ```js
 193 /*eslint no-underscore-dangle: ["error", { "allowFunctionParams": false }]*/
 194
 195 function foo (_bar) {}
 196 function foo (_bar = 0) {}
 197 function foo (..._bar) {}
 198
 199 const foo = function onClick (_bar) {}
 200 const foo = function onClick (_bar = 0) {}
 201 const foo = function onClick (..._bar) {}
 202
 203 const foo = (_bar) => {};
 204 const foo = (_bar = 0) => {};
 205 const foo = (..._bar) => {};
 206 ```
 207
 208 :::
 209
 210 ## When Not To Use It
 211
 212 If you want to allow dangling underscores in identifiers, then you can safely turn this rule off.