js配列forEachインスタンスの詳細な使用方法

js配列forEachインスタンスの詳細な使用方法

1. forEach() は map() に似ています。これも渡された関数に各要素を順番に適用しますが、新しい配列は返しません。

2. forEach() は、配列を走査し、配列の各要素を呼び出してコールバック関数に渡すためによく使用されます。転送関数は値を返す必要はありません。

var arr = [7,4,6​​,51,1];
試してください{arr.forEach((item,index)=>{
      (項目<5)の場合{
       throw new Error("myerr") //myerrの新しいエラーメッセージを作成する
      }
      console.log(item)//ループが終了したことを示すために7のみを出力します})}catch(e){
            console.log(e.message);
      if (e.message!=="myerr") { //定義したエラーでない場合は、そのまま破棄します。throw e
      }
     }

知識ポイントの拡張:

手書き forEach

forEach()メソッドは、配列の各要素に対して指定された関数を 1 回実行します。

arr.forEach(callback(currentValue[, index[, array]])[, thisArg]);

  • 折り返し電話

    • 現在の値
      配列内で現在処理されている要素。
    • index オプション 処理中の現在の要素の配列内のインデックス。
    • 配列オプション
      forEach() メソッドが操作する配列。
    • thisArg オプションオプションのパラメーター。コールバック関数が実行されたときに this の値として使用されます。
  • 戻り値なし

forEach関数にthisArgパラメータが指定されている場合、そのパラメータはコールバック関数のthis値として使用されます。それ以外の場合、 this値はundefined になります。コールバック関数内のthisのバインディングは、関数が呼び出されたときの一般的なthisバインディング ルールに従って決定されます。

arr = [1, 2, 3, 4]とします。

arr.forEach((...item) => console.log(item));

// [1, 0, 配列(4)] 現在の値
関数カウンター() {
 this.sum = 0;
 カウント = 0;
}

// thisArg パラメータ (this) は forEach() に渡されるため、呼び出されるたびに、その this 値としてコールバック関数に渡されます。
Counter.prototype.add = function(配列) {
 配列.forEach(関数(エントリ) {
  this.sum += エントリ;
  ++これ.count;
 }、 これ);
 // ^---- 注記
};

定数obj = 新しいカウンター();
obj.add([2, 5, 9]);
オブジェクトの数;
// 3 === (1 + 1 + 1)
オブジェクトの合計;
// 16 === (2 + 5 + 9)

  • すべての配列にはこのメソッドがあります
  • コールバックパラメータは、各項目、インデックス、元の配列です。
Array.prototype.forEach = function(fn, thisArg) {
 var _this;
 if (typeof fn !== "関数") {
  throw "パラメータは関数である必要があります";
 }
 引数の長さが1より大きい場合
  _this = この引数;
 }
 Array.isArray(arr) の場合 {
  throw "forEach メソッドは配列でのみ使用できます";
 }

 for (let index = 0; index < arr.length; index++) {
  fn.call(_this, arr[インデックス], インデックス, arr);
 }
};

js 配列 forEach の例の詳細な使用法に関するこの記事はこれで終わりです。js 配列 forEach メソッドの使用法の詳細については、123WORDPRESS.COM の以前の記事を検索するか、次の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • JavaScript で知らない Object.entries の使い方
  • js 配列 fill() 充填メソッド
  • JavaScript配列の重複排除のいくつかの方法についての詳細な説明
  • 任意の長さの配列を作成または埋めるための JS のヒントの要約
  • JavaScript 配列と非配列オブジェクトのディープ クローンとシャロー クローンの原則の詳細な説明
  • JavaScript配列重複排除の詳細な説明
  • js 配列エントリ() 反復メソッドを取得する

<<:  CSS と HTML とフロントエンド テクノロジーのレイヤー図

>>:  MySQL データ型 DECIMAL の使用方法の詳細な説明

推薦する

ウェブサイトをより高く、よりデザイン的に見せる方法

「ウェブサイトを高級感のあるものにするにはどうすればいいでしょうか? それともデザイン重視にすればい...

MySQLにおける静的変数の役割の詳細な説明

MySQLにおける静的変数の役割の詳細な説明静的変数の使用 静的変数サンプルコード: 関数テスト()...

win2008 サーバー セキュリティ設定の展開ドキュメント (推奨)

私は新年を迎える前からプロジェクトに取り組んでいましたが、ここ数日で、新しいサーバー用に新しく増設し...

VMware仮想マシンブリッジによるインターネット相互接続を実現する方法

VMware をインストールして新しい仮想マシンを作成したら、オプション バーの [編集] - [仮...

HTML で特定のテキストを非表示にするにはどうすればよいでしょうか?

テキスト非表示コード、HTML 内の特定のテキストを非表示にするコードをコピーコードは次のとおりです...

1 つの記事で v-model とその修飾子を学ぶ

目次序文v-model の修飾子:怠け者トリム番号さまざまな入力タイプやその他の要素での v-mod...

Linuxはscpコマンドを使用してファイルをローカルコンピュータにコピーし、ローカルファイルをリモートサーバーにコピーします。

以下のように表示されます。リモート サーバーのファイルをローカルにコピーします。 scp -r -P...

JavaScriptの知識ポイントの詳しい説明

目次1. JavaScriptの基礎2. 基本的なJavaScript構文3. JavaScript...

CocosCreatorでJSZip圧縮を使用する方法

CocosCreator バージョン: 2.4.2 jszipの実践的なプロジェクトアプリケーション...

dockerカスタムイメージでphp7をビルドする方法

まず、簡単な Docker インストールを実行します。イメージをカスタマイズするには、ベースイメージ...

CentOS8 デプロイメント LNMP 環境で mysql8.0.29 をコンパイルしてインストールする方法の詳細なチュートリアル

1. 前提条件何度かインストールしているので、エラーについてはこれ以上説明しません。ちょっとわかりに...

MySql で、存在しない場合は挿入し、存在する場合は更新する方法

まとめシナリオによっては、レコードがない場合は挿入し、レコードがある場合は更新するという要件がある場...

MySQL の組み込み関数 find_in_set を使用した効率的なあいまい検索の詳細な説明

一般的に使用される方法は次の 4 つです。 1.locate()メソッドを使用する一般的な使用法: ...

Vue カプセル化コンポーネント アップロード画像コンポーネント

この記事の例では、参考のためにvueアップロード画像コンポーネントの具体的なコードを共有しています。...

MySQL で日付時刻データを取得し、その後に .0 を追加する方法

MySQL のデータ型は datetime です。データベースに保存されているデータは 2015-0...