JSでforeachメソッドを使う方法を学んでください!

ねえ仲間のクリエイター.
foreachメソッドは、配列やNodelistsを使用している場合に便利です.
これらのコンテナの各要素のコールバック関数を実行できます.
どのように1分未満でそれを使用する方法を学びましょう!
閉じるこの動画はお気に入りから削除されています

使い方.
それを使用するには、3つのパラメータを取ることができるコールバック関数でそれをフィードする必要があります.
これらのパラメータは以下の通りです:

現在の値

インデックス

とあなたが働いている配列/nodelist.

const array = [1, 2, 3];

array.forEach((current, index, arr) => {
    console.log(current, index, arr);
});

コンソール/端末を見てください.


実際の例を3つのボタンを作成しましょう.
HTMLファイルで、3つのボタンを作成します

<button data-action="modify">Modify</button>
<button data-action="delete">Delete</button>
<button data-action="update">Update</button>

JSファイルで、ボタンを選択します.

const buttons = document.querySelectorAll('button'); 

.QueryAllメソッドはNodeListを返します.また、Nodelistsにはプロトタイプ内のforeachメソッドへのアクセスもあります.
このようにして、それぞれのボタンにイベントリスナーを取り付けることができます.

buttons.forEach(btn => {
    btn.addEventListener('click', (e) => {
        alert(e.target.getAttribute
        ('data-action'))
    })
});

これは基本的な例ですが、あなたは今、この方法がどれくらい役に立つかを知っています!
簡単にコードの繰り返しを避けることができます.
私のYouTubeチャンネルを見に来てください:
すぐにお会いしましょう!
ENZO