【JavaScript/jQuery】eachの実装方法

jQueryのeachの実装方法をご紹介いたします。

JavaScript標準のforEachの実装方法は以下記事をご覧ください。

eachの実装方法
eachの構文
公式ドキュメント

eachの実装方法

<script src="https://code.jquery.com/jquery-3.5.0.js"></script>
<ul>
    <li>foo</li>
    <li>bar</li>
</ul>

<script>
// パターン1
$('li').each(function(index) {
   console.log(index + ': ' + $(this).text());
});

// パターン2
$('li').each(function(index,element) {
   console.log(index + ': ' + $(element).text());
});

</script>

// 実行結果
// 結果はパターン1,2共に同じになります。
0: foo
1: bar

eachの構文

.each(callback([index,element]) {
    // execute something
})

引数	必須	説明
callback	必須	要素を取り出した時の処理を実装する
index	オプション	処理中の値の添字。処理中の配列番号が取得できる。
element	オプション	処理中のelementが取得できる。thisでも同じ値が参照できる。 ※パターン１参照