0Pricing
JavaScript Academy · レッスン

reduce、some/every、find — シンプルなパターン

合計値にはreduce、真偽値のチェックにはsome/every、最初に一致する要素の取得にはfindを使う方法を学びます。

「reduce、some/every、find — シンプルなパターン」はCoddyKit上の無料JavaScript Academyレッスンです。 これはレッスン2/2です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはJavaScript Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 JavaScript Academyコースには全2レッスンが含まれています。

reduceと仲間たちの概要

目標:reduceで複数の値を1つにまとめ、some/everyで配列を確認し、findで最初に一致する要素を取得します。

  • reduce:合計などの集計
  • some/every:簡単な確認
  • find:最初に一致する要素
reduce、some/every、find — シンプルなパターン — イラスト1

reduceによる合計

reduceはコールバックと初期値を受け取ります。各ステップで次のアキュムレーターを返します。

// reduce: sum numbers with an initial value
const prices = [4, 6, 3];

const total = prices.reduce(function (acc, n) {
  // Add current number to the accumulator
  return acc + n;
}, 0);

console.log("Total:", total);
reduce、some/every、find — シンプルなパターン — イラスト2

reduceによる最小値

アキュムレーターと各値を比較することで、minやmaxを計算できます。

// reduce: smallest number
const nums = [7, 2, 9, 4];

const min = nums.reduce(function (acc, n) {
  // Keep the smaller of acc or n
  return n < acc ? n : acc;
}, Infinity);

console.log("Min:", min);
reduce、some/every、find — シンプルなパターン — イラスト3

someの基本

someは、いずれかの要素がテストに合格するとtrueを返します。

// some: is there any even number?
const list = [1, 5, 8, 11];

const hasEven = list.some(function (n) {
  return n % 2 === 0;
});

console.log("Has even?", hasEven);
reduce、some/every、find — シンプルなパターン — イラスト4

everyの基本

everyは、すべての要素がテストに合格した場合にのみtrueを返します。

// every: are all ages 18+ ?
const ages = [22, 19, 31];

const allAdults = ages.every(function (a) {
  return a >= 18;
});

console.log("All adults?", allAdults);
reduce、some/every、find — シンプルなパターン — イラスト5

findの基本

findは、テストに一致する最初の要素を返します。一致する要素がない場合はundefinedを返します。

// find: get the first matching value (or undefined)
const users = [
  { name: "Ayla", active: true },
  { name: "Mina", active: false },
  { name: "Lena", active: true }
];

const firstInactive = users.find(function (u) {
  return u.active === false;
});

console.log("First inactive:", firstInactive);
reduce、some/every、find — シンプルなパターン — イラスト6

reduceの概念クイズ

簡単な確認:アキュムレーターを使うメソッドです。

reduce、some/every、find — シンプルなパターン — イラスト7

振り返り

振り返り:合計や最小値・最大値にはreduce、「いずれかが該当するか」の確認にはsome、「すべてが該当するか」の確認にはevery、最初に一致する要素の取得にはfindを使います。

reduce、some/every、find — シンプルなパターン — イラスト8

よくある質問

「reduce、some/every、find — シンプルなパターン」レッスンは無料ですか?

はい。「reduce、some/every、find — シンプルなパターン」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、JavaScript Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 JavaScript Academyコースには全2レッスンが含まれています。

「reduce、some/every、find — シンプルなパターン」で何を学びますか?

合計値にはreduce、真偽値のチェックにはsome/every、最初に一致する要素の取得にはfindを使う方法を学びます。 ブラウザで直接実行するハンズオンコードでJavaScript Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。

JavaScript Academyを始めるのに経験は必要ですか?

事前経験は必要ありません。CoddyKitのJavaScript Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン2/2です。

「reduce、some/every、find — シンプルなパターン」レッスンにはどのくらい時間がかかりますか?

ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。

このJavaScript Academyレッスンでコードを書いて実行できますか?

はい。すべてのJavaScript Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。

このコースのすべてのレッスン

  1. mapとfilter — 基本
  2. reduce、some/every、find — シンプルなパターン
← JavaScript Academyに戻る