[guide] No arrow function implicit return with side effects

This commit is contained in:
Felipe Vargas
2017-06-12 15:41:11 -07:00
committed by Jordan Harband
parent c43fc749c4
commit 4499ee0094

View File

@@ -369,7 +369,7 @@ Other Style Guides
```
<a name="arrays--callback-return"></a><a name="4.5"></a>
- [4.5](#arrays--callback-return) Use return statements in array method callbacks. Its ok to omit the return if the function body consists of a single statement following [8.2](#arrows--implicit-return). eslint: [`array-callback-return`](http://eslint.org/docs/rules/array-callback-return)
- [4.5](#arrays--callback-return) Use return statements in array method callbacks. Its ok to omit the return if the function body consists of a single statement returning an expression without side effects, following [8.2](#arrows--implicit-return). eslint: [`array-callback-return`](http://eslint.org/docs/rules/array-callback-return)
```javascript
// good
@@ -915,7 +915,7 @@ Other Style Guides
```
<a name="arrows--implicit-return"></a><a name="8.2"></a>
- [8.2](#arrows--implicit-return) If the function body consists of a single expression, omit the braces and use the implicit return. Otherwise, keep the braces and use a `return` statement. eslint: [`arrow-parens`](http://eslint.org/docs/rules/arrow-parens.html), [`arrow-body-style`](http://eslint.org/docs/rules/arrow-body-style.html) jscs: [`disallowParenthesesAroundArrowParam`](http://jscs.info/rule/disallowParenthesesAroundArrowParam), [`requireShorthandArrowFunctions`](http://jscs.info/rule/requireShorthandArrowFunctions)
- [8.2](#arrows--implicit-return) If the function body consists of a single statement returning an [expression](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Expressions_and_Operators#Expressions) without side effects, omit the braces and use the implicit return. Otherwise, keep the braces and use a `return` statement. eslint: [`arrow-parens`](http://eslint.org/docs/rules/arrow-parens.html), [`arrow-body-style`](http://eslint.org/docs/rules/arrow-body-style.html) jscs: [`disallowParenthesesAroundArrowParam`](http://jscs.info/rule/disallowParenthesesAroundArrowParam), [`requireShorthandArrowFunctions`](http://jscs.info/rule/requireShorthandArrowFunctions)
> Why? Syntactic sugar. It reads well when multiple functions are chained together.
@@ -939,6 +939,24 @@ Other Style Guides
[1, 2, 3].map((number, index) => ({
[index]: number,
}));
// No implicit return with side effects
function foo(callback) {
const val = callback();
if (val === true) {
// Do something if callback returns true
}
}
let bool = false;
// bad
foo(() => bool = true);
// good
foo(() => {
bool = true;
}
```
<a name="arrows--paren-wrap"></a><a name="8.3"></a>
@@ -1354,7 +1372,9 @@ Other Style Guides
// good
let sum = 0;
numbers.forEach(num => sum += num);
numbers.forEach((num) => {
sum += num;
);
sum === 15;
// best (use the functional force)
@@ -1369,7 +1389,9 @@ Other Style Guides
// good
const increasedByOne = [];
numbers.forEach(num => increasedByOne.push(num + 1));
numbers.forEach((num) => {
increasedByOne.push(num + 1);
);
// best (keeping it functional)
const increasedByOne = numbers.map(num => num + 1);