minor fixes

This commit is contained in:
Ilya Kantor 2022-06-14 07:30:49 +02:00
parent bebcbfa134
commit c3b904def3

View file

@ -234,12 +234,13 @@ Now let's cover methods that search in an array.
### indexOf/lastIndexOf and includes ### indexOf/lastIndexOf and includes
The methods [arr.indexOf](mdn:js/Array/indexOf), [arr.lastIndexOf](mdn:js/Array/lastIndexOf) and [arr.includes](mdn:js/Array/includes) have the same syntax and do essentially the same as their string counterparts, but operate on items instead of characters: The methods [arr.indexOf](mdn:js/Array/indexOf) and [arr.includes](mdn:js/Array/includes) have the similar syntax and do essentially the same as their string counterparts, but operate on items instead of characters:
- `arr.indexOf(item, from)` -- looks for `item` starting from index `from`, and returns the index where it was found, otherwise `-1`. - `arr.indexOf(item, from)` -- looks for `item` starting from index `from`, and returns the index where it was found, otherwise `-1`.
- `arr.lastIndexOf(item, from)` -- same, but looks for from right to left.
- `arr.includes(item, from)` -- looks for `item` starting from index `from`, returns `true` if found. - `arr.includes(item, from)` -- looks for `item` starting from index `from`, returns `true` if found.
Usually these methods are used with only one argument: the `item` to search. By default, the search is from the beginning.
For instance: For instance:
```js run ```js run
@ -249,27 +250,34 @@ alert( arr.indexOf(0) ); // 1
alert( arr.indexOf(false) ); // 2 alert( arr.indexOf(false) ); // 2
alert( arr.indexOf(null) ); // -1 alert( arr.indexOf(null) ); // -1
let fruits = ['Plum', 'Apple', 'Orange', 'Plum']
// note that the lastIndexOf method looks for from the end, but index counted from beginning
alert( fruits.lastIndexOf(Plum)) // 3
alert( arr.includes(1) ); // true alert( arr.includes(1) ); // true
``` ```
Note that the methods use `===` comparison. So, if we look for `false`, it finds exactly `false` and not the zero. Please note that `indexOf` uses the strict equality `===` for comparison. So, if we look for `false`, it finds exactly `false` and not the zero.
If we want to check for inclusion, and don't want to know the exact index, then `arr.includes` is preferred. If we want to check if `item` exists in the array, and don't need the exact index, then `arr.includes` is preferred.
Also, a minor, but noteworthy feature of `includes` is that it correctly handles `NaN`, unlike `indexOf/lastIndexOf`: The method [arr.lastIndexOf](mdn:js/Array/lastIndexOf) is the same as `indexOf`, but looks for from right to left.
```js run
let fruits = ['Apple', 'Orange', 'Apple']
alert( arr.indexOf('Apple') ); // 0 (first Apple)
alert( arr.lastIndexOf('Apple') ); // 2 (last Apple)
```
````smart header="The `includes` method handles `NaN` correctly"
A minor, but noteworthy feature of `includes` is that it correctly handles `NaN`, unlike `indexOf`:
```js run ```js run
const arr = [NaN]; const arr = [NaN];
alert( arr.indexOf(NaN) ); // -1 (should be 0, but equality test === doesn't work for NaN) alert( arr.indexOf(NaN) ); // -1 (wrong, should be 0)
alert( arr.includes(NaN) );// true (correct) alert( arr.includes(NaN) );// true (correct)
``` ```
That's because `includes` was added to JavaScript much later and uses the more up to date comparison algorithm internally.
````
### find and findIndex/findLastIndex
### find and findIndex
Imagine we have an array of objects. How do we find an object with the specific condition? Imagine we have an array of objects. How do we find an object with the specific condition?
@ -309,7 +317,28 @@ In real life arrays of objects is a common thing, so the `find` method is very u
Note that in the example we provide to `find` the function `item => item.id == 1` with one argument. That's typical, other arguments of this function are rarely used. Note that in the example we provide to `find` the function `item => item.id == 1` with one argument. That's typical, other arguments of this function are rarely used.
The [arr.findIndex](mdn:js/Array/findIndex) method is essentially the same, but it returns the index where the element was found instead of the element itself and `-1` is returned when nothing is found. The [arr.findIndex](mdn:js/Array/findIndex) method has the same syntax, but returns the index where the element was found instead of the element itself. The value of `-1` is returned if nothing is found.
The [arr.findLastIndex](mdn:js/Array/findLastIndex) method is like `findIndex`, but searches from right to left, similar to `lastIndexOf`.
Here's an example:
```js run
let users = [
{id: 1, name: "John"},
{id: 2, name: "Pete"},
{id: 3, name: "Mary"},
{id: 4, name: "John"}
];
// Find the index of the first John
alert(users.findIndex(user => user.name == 'John')); // 0
// Find the index of the last John
alert(users.findLastIndex(user => user.name == 'John')); // 3
```
### filter ### filter