for…of文とは？
for…of文は配列の項目数文繰り返し処理を行います。
for(let 変数名 of 配列名){
処理内容
}実際には次のような使い方をします。
const foods=["オレンジ","パパイヤ","メロン"]
for(let item of foods){
console.log(item);
}結果は以下のようになります。
"オレンジ"
"パパイヤ"
"メロン"それぞれの項目をリスト化してHTMLに出力してみよう
for…of文でfoods配列から要素を取り出して、HTMLのタグに挟んで出力しています。insertAdjacentHTML()はHTMLタグを挿入するメソッドです。beforeendを指定することで、挿入するタグ（つまり</ul>）の前に要素を出力します。
<ul id = foodsList></ul>const foods=["オレンジ","パパイヤ","メロン"];
for(let item of foods){
const li =`<li>${item}</li>`;
document.getElementById(`foodsList`).insertAdjacentHTML('beforeend',li);
}