jQueryで配列をループする

JavaScript では、配列やその他のオブジェクトの反復を実装できる幅広い可能性があります。 jQuery では、イテレータを開始する方法は 1つしかありません: $.each() メソッドです。

この短い記事では、jQuery で $.each() メソッドと for ループを使用して配列をループ処理する方法を示します。

$.each() メソッドと jQuery の for ループ

for ループと $.each() メソッドを区別すると、for ループは操作フローがどのように実行されているかをより明確に示します。 また、比較してより多くのコード行を作成します。

それに対して、jQuery メソッドではプロセス全体が抽象化されます。 必要なのは、$.each() によるメソッドの開始と、インデックスと値をパラメーターとして持つドライバー関数の追加だけです。

次のセクションでは、$.each() 関数と for ループがどのように機能するかを観察します。 定義済みの jQuery メソッドの代わりに、配列を反復する従来の方法を実装することもできます。

jQuery で for ループを使用する

コードスニペット：

var arr = [7, 4, 2, 4];
var sum = 0;
for (var i = 0; i < arr.length; i++) {
  sum += arr[i];
}
console.log('Using for loop and sum: ' + sum);

出力：

ご覧のとおり、jQuery ウィンドウ関数については言及されていません。 そのため、配列を反復する専用の jQuery の方法であるとは言えません。

繰り返しますが、jQuery は JavaScript のライブラリであるため、使いやすさを要約します。

$.each() メソッドを使用して jQuery で配列を反復処理する

配列を取り、$.each() メソッドで、index と value という名前のパラメータを持つ関数を統合します。 反復を示すために変数を設定しません。

むしろ、1 行のコードで値を簡単に合計できます。

コードスニペット：

var arr = [7, 5, 9, 4];
var sum = 0;
$.each(arr, (index, val) => {
  sum += val;
});
console.log('Using jQuery each and the Sum: ' + sum);

出力：