eslint/docs/src/rules/space-before-function-parentheses.md

   1 ---
   2 title: space-before-function-parentheses
   3 layout: doc
   4
   5 related_rules:
   6 - space-after-keywords
   7 - space-return-throw-case
   8 ---
   9
  10 Enforces consistent spacing before opening parenthesis in function definitions.
  11
  12 (removed) This rule was **removed** in ESLint v1.0 and **replaced** by the [space-before-function-paren](space-before-function-paren) rule. The name of the rule changed from "parentheses" to "paren" for consistency with the names of other rules.
  13
  14 When formatting a function, whitespace is allowed between the function name or `function` keyword and the opening paren. Named functions also require a space between the `function` keyword and the function name, but anonymous functions require no whitespace. For example:
  15
  16 ```js
  17 function withoutSpace(x) {
  18     // ...
  19 }
  20
  21 function withSpace (x) {
  22     // ...
  23 }
  24
  25 var anonymousWithoutSpace = function() {};
  26
  27 var anonymousWithSpace = function () {};
  28 ```
  29
  30 Style guides may require a space after the `function` keyword for anonymous functions, while others specify no whitespace. Similarly, the space after a function name may or may not be required.
  31
  32 ## Rule Details
  33
  34 This rule aims to enforce consistent spacing before function parentheses and as such, will warn whenever whitespace doesn't match the preferences specified.
  35
  36 This rule takes one argument. If it is `"always"`, which is the default option, all named functions and anonymous functions must have space before function parentheses. If `"never"` then all named functions and anonymous functions must not have space before function parentheses. If you want different spacing for named and anonymous functions you can pass a configuration object as the rule argument to configure those separately (e. g. `{"anonymous": "always", "named": "never"}`).
  37
  38 Examples of **incorrect** code for this rule with the default `"always"` option:
  39
  40 ::: incorrect
  41
  42 ```js
  43 /*eslint-env es6*/
  44
  45 function foo() {
  46     // ...
  47 }
  48
  49 var bar = function() {
  50     // ...
  51 };
  52
  53 var bar = function foo() {
  54     // ...
  55 };
  56
  57 class Foo {
  58     constructor() {
  59         // ...
  60     }
  61 }
  62
  63 var foo = {
  64     bar() {
  65         // ...
  66     }
  67 };
  68 ```
  69
  70 :::
  71
  72 Examples of **correct** code for this rule with the default `"always"` option:
  73
  74 ::: correct
  75
  76 ```js
  77 /*eslint-env es6*/
  78
  79 function foo () {
  80     // ...
  81 }
  82
  83 var bar = function () {
  84     // ...
  85 };
  86
  87 var bar = function foo () {
  88     // ...
  89 };
  90
  91 class Foo {
  92     constructor () {
  93         // ...
  94     }
  95 }
  96
  97 var foo = {
  98     bar () {
  99         // ...
 100     }
 101 };
 102 ```
 103
 104 :::
 105
 106 Examples of **incorrect** code for this rule with the `"never"` option:
 107
 108 ::: incorrect
 109
 110 ```js
 111 /*eslint-env es6*/
 112
 113 function foo () {
 114     // ...
 115 }
 116
 117 var bar = function () {
 118     // ...
 119 };
 120
 121 var bar = function foo () {
 122     // ...
 123 };
 124
 125 class Foo {
 126     constructor () {
 127         // ...
 128     }
 129 }
 130
 131 var foo = {
 132     bar () {
 133         // ...
 134     }
 135 };
 136 ```
 137
 138 :::
 139
 140 Examples of **correct** code for this rule with the `"never"` option:
 141
 142 ::: correct
 143
 144 ```js
 145 /*eslint-env es6*/
 146
 147 function foo() {
 148     // ...
 149 }
 150
 151 var bar = function() {
 152     // ...
 153 };
 154
 155 var bar = function foo() {
 156     // ...
 157 };
 158
 159 class Foo {
 160     constructor() {
 161         // ...
 162     }
 163 }
 164
 165 var foo = {
 166     bar() {
 167         // ...
 168     }
 169 };
 170 ```
 171
 172 :::
 173
 174 Examples of **incorrect** code for this rule with the `{"anonymous": "always", "named": "never"}` option:
 175
 176 ::: incorrect
 177
 178 ```js
 179 /*eslint-env es6*/
 180
 181 function foo () {
 182     // ...
 183 }
 184
 185 var bar = function() {
 186     // ...
 187 };
 188
 189 class Foo {
 190     constructor () {
 191         // ...
 192     }
 193 }
 194
 195 var foo = {
 196     bar () {
 197         // ...
 198     }
 199 };
 200 ```
 201
 202 :::
 203
 204 Examples of **correct** code for this rule with the `{"anonymous": "always", "named": "never"}` option:
 205
 206 ::: correct
 207
 208 ```js
 209 /*eslint-env es6*/
 210
 211 function foo() {
 212     // ...
 213 }
 214
 215 var bar = function () {
 216     // ...
 217 };
 218
 219 class Foo {
 220     constructor() {
 221         // ...
 222     }
 223 }
 224
 225 var foo = {
 226     bar() {
 227         // ...
 228     }
 229 };
 230 ```
 231
 232 :::
 233
 234 Examples of **incorrect** code for this rule with the `{"anonymous": "never", "named": "always"}` option:
 235
 236 ::: incorrect
 237
 238 ```js
 239 /*eslint-env es6*/
 240
 241 function foo() {
 242     // ...
 243 }
 244
 245 var bar = function () {
 246     // ...
 247 };
 248
 249 class Foo {
 250     constructor() {
 251         // ...
 252     }
 253 }
 254
 255 var foo = {
 256     bar() {
 257         // ...
 258     }
 259 };
 260 ```
 261
 262 :::
 263
 264 Examples of **correct** code for this rule with the `{"anonymous": "never", "named": "always"}` option:
 265
 266 ::: correct
 267
 268 ```js
 269 /*eslint-env es6*/
 270
 271 function foo () {
 272     // ...
 273 }
 274
 275 var bar = function() {
 276     // ...
 277 };
 278
 279 class Foo {
 280     constructor () {
 281         // ...
 282     }
 283 }
 284
 285 var foo = {
 286     bar () {
 287         // ...
 288     }
 289 };
 290 ```
 291
 292 :::
 293
 294 ## When Not To Use It
 295
 296 You can turn this rule off if you are not concerned with the consistency of spacing before function parenthesis.