[Array.find(…)](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find) was introduced in ES2015 (ES6).
It returns the first element of an array for which the testing function parameter returns a truthy value. 

Before the introduction of `array.find(…)`, it was common to use the first element from a filtered result instead, i.e., `array.filter(…)[0]`. This refactoring modernizes the older expression.

Replace `anArray.filter(…)[0]` with `anArray.find(…)`.

Convert array.filter()[0] to array.find()

Replace `array.indexOf()` checks with `array.includes()`.

Convert array.indexOf() into array.includes()

This refactoring replaces string comparison chains with an `array.includes()` call. It works for regular string comparisons with `|| ===` and for negated string comparisons with `&& !==`. When the string comparison is negated, the `.includes` call is prefixed with `!`.

## Example

```javascript
if (obj.property === "value1" 
    || obj.property === "value2" 
    || obj.property === "value3") {
    // ...
}
```
becomes
```javascript
if (["value1", "value2", "value3"].includes(obj.property)) {
    // ...
}
```



Replace `|| value === 'aString'` and `&& value !== 'aString'`  chains with `array.includes()`.

Convert string comparison chain to array.includes()

The refactoring supports converting regular `for` loops over an array with an index variable as well as `for..of` loops into `.forEach()` loops.

Replace regular `for` loops with `.forEach()` loops.

Convert loop to .forEach

**`for...of` loops over iterable objects, for example arrays or strings.**

It is easier to read than indexed `for` loops and can replace them in many cases.

### Refactoring Example
Before:
```javascript
for (let i = 0; i < elements.length; i++) {
  const element = elements[i];
  console.log(element);
}
```

After:
```javascript
for (const element of elements) {
  console.log(element);
}
```


Replace regular `for` loops and `anArray.forEach` loops with `for…of` loops.

Convert loop to for…of

Replace `for…of` with a regular `for` loop that has an index variable.

Convert loop to for

The `anArray.map(aFunction)` function creates a new array that contains a transformed value for each original array element.
It can be used to replace patterns where a value is calculated for each array element and then pushed into a new array.

For example, 
```javascript
const values = [];
for (const element of elements) {
  values.push(f(element));
}
```
becomes
```javascript
const values = elements.map((element) => {
  return f(element);
});
```

When there is an inner spread expression, the refactoring converts to `anArray.flatMap`:
```javascript
const values = [];
for (const element of elements) {
  values.push(...element);
}
```
becomes
```javascript
const values = elements.flatMap((element) => {
  return element;
});
```

The refactoring works on regular `for` loops, `for..of` loops, and `.forEach` calls.

Convert a loop with `.push()` into a `.map()` call.

Convert loop to .map()

Move array element

Move object property

JavaScript has several ways of defining loops and many array methods that work on the whole array. The JS Assistant provides several code actions for converting between different types of for loops and for converting to more idiomatic array methods such as array.includes().

9 Code Assists for Arrays and Loops