89628


# 概要

forof文を書こうと思ったら、`[Symbol.iterator]()` が必要だと怒られた。

[code]

    const test = [
    { code: 0, name: "北海道" },
    { code: 1, name: "東京都" },
    { code: 2, name: "大阪府" },
    ];
    
    function createPrefOptionsHTML(prefs: object) {
     const optionsStrs = [];
     for (const pref of prefs ) {          <= error
      optionsStrs.push(
       `<option name="${pref.name}" value="${pref.code}>${pref.name}</option>`
      );
     }
    const prefSelector = document.getElementById("areaSelector")?.querySelector(".prefectures");
    prefSelector!.innerHTML = optionsStrs.join("");
    createPrefOptionsHTML(test);
    
[/code]

どう記述すればいいのでしょう


CC BY-SA 4.0
2022-06-27T07:02:02.903
89623
2022-06-27T09:40:41.153
2022-06-27T09:40:41.153
3054
53242
question
javascript typescript
TypeScirpt の for...of 文で [Symbol.iterator]() が必要と言われる


引数 `prefs` の型を `object` にしているのが原因です。

`object` だけでは
[`for...of`](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Statements/for...of)
に使える反復可能オブジェクトであることを表現できていません。使うのが配列であれば、配列型を指定すれば問題のエラーは消えます。

[code]

    prefs: object[]
    
[/code]

ただし、これでは別の箇所でまたエラーか警告が出るでしょう。`pref.name`
などとしてプロパティにアクセスしている箇所です。これらのプロパティが存在することを `object`
では表現できていません。これにも対処すると、例えば以下のようになります。

[code]

    type Pref = { code: number; name: string }
    
    function createPrefOptionsHTML(prefs: Pref[]) {
    
[/code]


CC BY-SA 4.0
2022-06-27T09:36:03.367
89628
2022-06-27T09:36:03.367
3054
89623
answer