2024/07/26 時点の英語版に基づき更新

files/ja/web/javascript/reference/global_objects/array/foreach/index.md

@@ -2,7 +2,7 @@
 title: Array.prototype.forEach()
 slug: Web/JavaScript/Reference/Global_Objects/Array/forEach
 l10n:
-  sourceCommit: fb85334ffa4a2c88d209b1074909bee0e0abd57a
+  sourceCommit: 8421c0cd94fa5aa237c833ac6d24885edbc7d721
 ---
 
 {{JSRef}}
@@ -37,19 +37,10 @@ forEach(callbackFn, thisArg)
 
 ## 解説
 
-`forEach()` メソッドは[反復処理メソッド](/ja/docs/Web/JavaScript/Reference/Global_Objects/Array#反復処理メソッド)です。指定された関数 `callbackFn` を配列に含まれる各要素に対して一度ずつ、昇順で呼び出します。 {{jsxref("Array/map", "map()")}} と異なり、 `forEach()` は常に {{jsxref("undefined")}} を返し、連鎖させることはできません。典型的な使用する用途は、チェーンの終わりで副次効果を実行することです。
+`forEach()` メソッドは[反復処理メソッド](/ja/docs/Web/JavaScript/Reference/Global_Objects/Array#反復処理メソッド)です。指定された関数 `callbackFn` を配列に含まれる各要素に対して一度ずつ、昇順で呼び出します。 {{jsxref("Array/map", "map()")}} と異なり、 `forEach()` は常に {{jsxref("undefined")}} を返し、連鎖させることはできません。典型的な使用する用途は、チェーンの終わりで副次効果を実行することです。これらのメソッドが一般的にどのように動作するのかについての詳細は、[反復処理メソッド](/ja/docs/Web/JavaScript/Reference/Global_Objects/Array#反復処理メソッド)の節をご覧下さい。
 
 `callbackFn` は値が割り当てられている配列インデックスに対してのみ呼び出されます。[疎配列](/ja/docs/Web/JavaScript/Guide/Indexed_collections#sparse_arrays)で空のスロットに対しては呼び出されません。
 
-`forEach()` メソッドは呼び出し元の配列を変更しませんが、 `callbackFn` に指定された関数は変更することがあります。ただし、配列の長さは `callbackFn` を最初に呼び出す前に保存されることに注意してください。したがって、
-
-- `callbackFn` は `forEach()` の呼び出しを始めたときの配列の長さを超えて追加された要素にはアクセスしません。
-- 既に訪問した位置を変更しても、 `callbackFn` が再度呼び出されることはありません。
-- まだ訪問していない既存の配列要素が `callbackFn` によって変更された場合、 `callbackFn` に渡される値はその要素が取得される時点の値になります。[削除](/ja/docs/Web/JavaScript/Reference/Operators/delete)された要素は `undefined` であるかのように処理されます。
-
-> [!WARNING]
-> 前項で説明したような、参照中の配列の同時進行での変更は（特殊な場合を除いて）普通は避けるべきです。多くの場合、理解しにくいコードになります。
-
 `forEach()` メソッドは[汎用的](/ja/docs/Web/JavaScript/Reference/Global_Objects/Array#汎用的な配列メソッド)です。これは `this` 値に `length` プロパティと整数キーのプロパティがあることだけを期待します。
 
 例外を発生する以外の方法で、 `forEach()` ループを止めたり脱出したりする方法はありません。そのような動作を行う場合、 `forEach()` メソッドは適切な方法ではありません。
@@ -77,27 +68,6 @@ console.log(sum);
 
 ## 例
 
-### 不連続な配列に対する forEach() の使用
-
-```js-nolint
-const arraySparse = [1, 3, /* 空 */, 7];
-let numCallbackRuns = 0;
-
-arraySparse.forEach((element) => {
-  console.log({ element });
-  numCallbackRuns++;
-});
-
-console.log({ numCallbackRuns });
-
-// { element: 1 }
-// { element: 3 }
-// { element: 7 }
-// { numCallbackRuns: 3 }
-```
-
-3 と 7 の間の値がないところで、コールバック関数が呼び出されなかったことが分かります。
-
 ### for ループから forEach への変換
 
 ```js
@@ -118,7 +88,7 @@ items.forEach((item) => {
 ### 配列の内容の出力
 
 > [!NOTE]
-> 配列の内容をコンソールに表示するために、配列の整形済みのバージョンを表示する {{domxref("Console/table", "console.table()")}} を使用することができます。
+> 配列の内容をコンソールに表示するために、配列の整形済みのバージョンを表示する {{domxref("console/table_static", "console.table()")}} を使用することができます。
 >
 > 以下の例では同じことを `forEach()` を使用して行う他の方法を説明しています。
 
@@ -149,7 +119,7 @@ class Counter {
     this.count = 0;
   }
   add(array) {
-    // Only function expressions will have its own this binding
+    // Only function expressions have their own this bindings.
     array.forEach(function countEntry(entry) {
       this.sum += entry;
       ++this.count;
@@ -190,31 +160,9 @@ const obj1 = { a: 1, b: 2 };
 const obj2 = copy(obj1); // obj2 looks like obj1 now
 ```
 
-### 反復処理中の配列の変更
-
-次の例では `one`, `two`, `four` をログ出力します。
-
-値 `two` を含む項目に到達すると、配列全体の最初の項目が取り出され、残りのすべての項目が 1 つずつ繰り上がります。
-要素 `four` は配列の前の方の位置にあるので、 `three` は飛ばされます。
-
-`forEach()` は反復処理の前に配列のコピーを生成しません。
-
-```js
-const words = ["one", "two", "three", "four"];
-words.forEach((word) => {
-  console.log(word);
-  if (word === "two") {
-    words.shift(); // 'one' が配列から削除される
-  }
-}); // one // two // four
-
-console.log(words); // ['two', 'three', 'four']
-```
-
 ### 配列の平坦化
 
-次の例は学習目的だけのものです。
-組み込みメソッドを使用して配列を平坦化したい場合は、{{jsxref("Array.prototype.flat()")}} を使用することができます。
+次の例は学習目的だけのものです。組み込みメソッドを使用して配列を平坦化したい場合は、{{jsxref("Array.prototype.flat()")}} を使用することができます。
 
 ```js
 const flatten = (arr) => {
@@ -234,6 +182,47 @@ const nested = [1, 2, 3, [4, 5, [6, 7], 8, 9]];
 console.log(flatten(nested)); // [1, 2, 3, 4, 5, 6, 7, 8, 9]
 ```
 
+### callbackFn の第 3 引数の使用
+
+`array` 引数は、配列の別の要素にアクセスしたい場合、特に配列を参照する既存の変数を保有していない場合に便利です。次の例では、最初の `filter()` を使用して正の値を抽出し、次に `forEach()` を使用してその付近をログに記録します。
+
+```js
+const numbers = [3, -1, 1, 4, 1, 5];
+numbers
+  .filter((num) => num > 0)
+  .forEach((num, idx, arr) => {
+    // arr 引数がない場合、変数に保存せずに中間配列に
+    // 簡単にアクセスする方法はない
+    console.log(arr[idx - 1], num, arr[idx + 1]);
+  });
+// undefined 3 1
+// 3 1 4
+// 1 4 1
+// 4 1 5
+// 1 5 undefined
+```
+
+### 疎配列に対する forEach() の使用
+
+```js-nolint
+const arraySparse = [1, 3, /* 空 */, 7];
+let numCallbackRuns = 0;
+
+arraySparse.forEach((element) => {
+  console.log({ element });
+  numCallbackRuns++;
+});
+
+console.log({ numCallbackRuns });
+
+// { element: 1 }
+// { element: 3 }
+// { element: 7 }
+// { numCallbackRuns: 3 }
+```
+
+3 と 7 の間の値がないところで、コールバック関数が呼び出されなかったことが分かります。
+
 ### 配列以外のオブジェクトに対する forEach() の呼び出し
 
 `forEach()` メソッドは `this` の `length` プロパティを読み込み、次にキーが `length` より小さい非負の整数である各プロパティにアクセスします。

files/ja/web/javascript/reference/global_objects/array/values/index.md

@@ -2,12 +2,12 @@
 title: Array.prototype.values()
 slug: Web/JavaScript/Reference/Global_Objects/Array/values
 l10n:
-  sourceCommit: e01fd6206ce2fad2fe09a485bb2d3ceda53a62de
+  sourceCommit: 8421c0cd94fa5aa237c833ac6d24885edbc7d721
 ---
 
 {{JSRef}}
 
-**`values()`** は {{jsxref("Array")}} インスタンスのメソッドで、配列の各インデックスの値を含む新しい「[配列イテレーター](/ja/docs/Web/JavaScript/Reference/Iteration_protocols#イテレータープロトコル)」オブジェクトを返します。
+**`values()`** は {{jsxref("Array")}} インスタンスのメソッドで、配列の各要素の値を含む新しい[配列イテレーター](/ja/docs/Web/JavaScript/Reference/Global_Objects/Iterator)オブジェクトを返します。
 
 {{EmbedInteractiveExample("pages/js/array-values.html")}}
 
@@ -27,13 +27,13 @@ values()
 
 ## 解説
 
-`Array.prototype.values()` は [`Array.prototype[@@iterator]()`](/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/@@iterator) の既定の実装です。
+`Array.prototype.values()` は [`Array.prototype[Symbol.iterator]()`](/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/Symbol.iterator) の既定の実装です。
 
 ```js
 Array.prototype.values === Array.prototype[Symbol.iterator]; // true
 ```
 
-[疎配列](/ja/docs/Web/JavaScript/Guide/Indexed_collections#sparse_arrays)に使用された場合、 `values()` メソッドは空のスロットを `undefined` の値である可能用に反復処理します。
+[疎配列](/ja/docs/Web/JavaScript/Guide/Indexed_collections#疎配列)に使用された場合、 `values()` メソッドは空のスロットを `undefined` の値であるかのように反復処理します。
 
 `values()` メソッドは[汎用的](/ja/docs/Web/JavaScript/Reference/Global_Objects/Array#汎用的な配列メソッド)です。このメソッドは `this` 値に `length` プロパティと整数キーのプロパティがあることだけを期待します。
 
@@ -120,6 +120,16 @@ arr[1] = "n";
 console.log(iterator.next().value); // "n"
 ```
 
+[反復処理メソッド](/ja/docs/Web/JavaScript/Reference/Global_Objects/Array#反復処理メソッド)とは異なり、配列イテレーターオブジェクトは作成時に配列の長さを保存せず、反復処理のたびに一度だけ読み込みます。そのため、反復処理中に配列が大きくなった場合、イテレーターは新しい要素も処理します。これにより、無限ループが発生する可能性があります。
+
+```js
+const arr = [1, 2, 3];
+for (const e of arr) {
+  arr.push(e * 10);
+}
+// RangeError: invalid array length
+```
+
 ### 疎配列の反復処理
 
 `values()` は空のスロットを `undefined` であるかのように処理します。
@@ -167,6 +177,6 @@ for (const entry of Array.prototype.values.call(arrayLike)) {
 - {{jsxref("Array")}}
 - {{jsxref("Array.prototype.entries()")}}
 - {{jsxref("Array.prototype.keys()")}}
-- [`Array.prototype[@@iterator]()`](/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/@@iterator)
+- [`Array.prototype[Symbol.iterator]()`](/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/Symbol.iterator)
 - {{jsxref("TypedArray.prototype.values()")}}
 - [反復処理プロトコル](/ja/docs/Web/JavaScript/Reference/Iteration_protocols)