[[配列 (JavaScript)|配列]]は最もよく利用される[[オブジェクト (JavaScript)|オブジェクト]]の1つです。まずは[[配列 (JavaScript)|配列]]の基礎と、要素の検索方法を学びましょう。
## Reference
- [配列 · JavaScript Primer \#jsprimer](https://jsprimer.net/basic/array/)
## Lesson
### 基礎
[[配列 (JavaScript)|配列]]の作成には[[配列リテラル (JavaScript)|配列リテラル]]を使います。
```js
const xs = [1, 2, 3]
```
[[配列 (JavaScript)|配列]]の要素にアクセスするには `xs[0]` のようなインデックスアクセスを使います。存在しないインデックスを指定した場合は [[undefined (JavaScript)|undefined]] が返ります。
```js
const xs = [1, 2, 3]
xs[1]
// 2
xs[99]
// undefined
```
[[Array.prototype.at (JavaScript)|Array.prototype.at]]を使うと末尾の要素へのアクセスも簡略化できます。
```js
const xs = [1, 2, 3]
xs.at(-1)
// 3
```
値が[[配列 (JavaScript)|配列]]かどうかを確認する場合は [[Array.isArray (JavaScript)|Array.isArray]] を使います。
```js
Array.isArray([1, 2])
// true
Array.isArray({id: 1})
// false
```
### 検索
[[配列 (JavaScript)|配列]]から条件を満たす要素を **1つだけ** 検索する場合は [[Array.prototype.find (JavaScript)|Array.prototype.find]] を使います。
```js
["one", "two", "three", "four", "five"].find((x) => x.length > 3)
// "three"
```
[[配列 (JavaScript)|配列]]から条件を満たす要素を **すべて** 検索する場合は [[Array.prototype.filter (JavaScript)|Array.prototype.filter]] を使います。
```js
["one", "two", "three", "four", "five"].filter((x) => x.length > 3)
// [ "three", "four", "five" ]
```
## Mission 1
#😁EASY
[[Array.prototype.filter (JavaScript)|Array.prototype.filter]] で条件を満たす要素が **1つも存在しなかった** ときの返却値を解答してください。
%%
解答例
```js
[]
```
%%
## Mission 2
#😁EASY
[[Array.prototype.find (JavaScript)|Array.prototype.find]] で条件を満たす要素が **1つも存在しなかった** ときの返却値を解答してください。
%%
解答例
```js
undefined
```
%%
## Mission 3
#🙂NORMAL
以下のコードを **`for` を使わないように** リファクタリングしてください。
```js
function findNegative(numbers) {
for (const n of numbers) {
if (n < 0) {
return n;
}
}
}
```
%%
解答例
```js
function findNegative(numbers) {
return numbers.find((n) => n < 0);
}
```
%%
## Mission 4
#🙂NORMAL
以下のコードを **`for` を使わないように** リファクタリングしてください。
```js
function filterNegative(numbers) {
const negatives = [];
for (const n of numbers) {
if (n < 0) {
negatives.push(n);
}
}
return negatives;
}
```
%%
解答例
```js
function filterNegative(numbers) {
return numbers.filter((n) => n < 0);
}
```
%%
## Mission 5
#🙂NORMAL
以下コードの `findLastAdult` 関数を **2通りの方法で** 実装してください。ただし、**以下の条件を守って**ください。
- `for` を使ってはいけない
- 2つとも [[Array.prototype.filter (JavaScript)|Array.prototype.filter]] を使ってはいけない (1つならOK)
```js
import { expect } from "jsr:@std/expect";
/**
* 最後の成人を返却する
*/
function findLastAdult(guests) {
// FIXME: 実装
}
const guests = [
{ id: 1, name: "Ichiro", age: 28 },
{ id: 2, name: "Jiro", age: 68 },
{ id: 3, name: "Saburo", age: 17 },
{ id: 4, name: "Shiro", age: 12 },
{ id: 5, name: "Goro", age: 21 },
];
Deno.test("test", () => {
expect(findLastAdult(guests)).toEqual({ id: 5, name: "Goro", age: 21 });
});
```
%%
解答例
```js
function findLastAdult(guests) {
return guests.filter((x) => x.age >= 18).at(-1);
}
```
```js
function findLastAdult(guests) {
return guests.findLast((x) => x.age >= 18);
}
```
%%
---
*NEXT* >> [[📗TDQ-016 配列の変換 その１]]