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

3997 ワード
javascript tutorial html テキストリンク
ねえ仲間のクリエイター.
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
    [Algorithm] Backtracking
    [Swiftアルゴリズム]約数の個数と加算