JS：forEach内のforループ

Question

私はdivの中に4 canvasの要素を作成しようとしていますforのループ内にはforEachを使用しています。ここ

は、サンプルコードである：

const wavePart = document.querySelectorAll('.waves'); 
wavePart.forEach(element => { 
    for (i; i < 4; i += 1) { 
    let can = document.createElement('canvas'); 
    element.appendChild(can); 
    } 
}); 

このコードは、最初wavePart内部4つのキャンバスを作成するだけ、それはすべてのコンテナをループしません。私は何か間違っているのですか？

Answer 1

はい、あなたがしている：

1. はiが何らかの含むコードによって定義されているに依存し、

2. はあなたのループで

をiの初期値を設定しませんしたがって、最初のforEachコールバックの後にiが4に残っています。ループバックボディは実行されません。i < 4はその時点で常にfalseです。

代わりに、コールバック内でローカルiを宣言し、で開始する0に設定します。

const wavePart = document.querySelectorAll('.waves'); 
wavePart.forEach(element => { 
    for (let i = 0; i < 4; i += 1) { 
    // ^^^^^^^^^ 
    let can = document.createElement('canvas'); 
    element.appendChild(can); 
    } 
});