javascript - Hvordan itererer/tilgår jeg responsoverskrifter fra et fetch-kall i Typescript?

Vurder følgende TS-eksempel:

fetch("http://localhost:3000/auth", {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
    body: JSON.stringify(data)
  })
  .then((response) => {
    // would like to store some information from the response's headers
    // like access tokens etc.

    // Typescript complains about this iteration (see more info below)
    for (var pair of response.headers.entries()) {
      console.log(pair[0] + ': ' + pair[1])
    }

    return response.json()
  })
  // get the response data etc...
  .then((data) => {
    console.log(data);
  })
  // log an error etc...
  .catch((error) => {
    console.log('ERROR: ', error);
  })

Normalt ville dette være gyldig, men Typescript klager på iterasjonen og foreslår et kompilatoralternativ:

Type 'IterableIterator<[string, string]>' is not an array type or a string type.
Use compiler option '--downlevelIteration' to allow iterating of iterators.

Er det noen ulemper ved å bruke --downlevelIteration? Finnes det en annen måte å oppnå dette på uten å måtte endre kompilatorinnstillingene?

Takk!

Svar #1

Iteratorer (i noen språk kalt Enumeratorer) ble lagt til i ES6. De er ikke til stede i ES5 og eldre. Før ES6 var den eneste iterable konstruksjonen Array eller såkalte array-lignende innebygde objekter. ES6 introduserte iteratorer og funksjoner som for ... of som fungerer med dem. Når man retter seg mot under ES6 må man bruke downlevelIteration for å transpile ES6-iterator kode til ES5-kompatibel kode (iterator vil bli endret til Array og for ... of vil bli erstattet av ES5 gyldig syntaks). Hvis du ikke bruker noen annen transpiler enn TSC, har du ikke noe annet valg enn å aktivere dette flagget.

Svar #2

const getHeaders = (headers: Headers) => {
  let headerObj: IObject = {};
  const keys = headers.keys();
    let header = keys.next();
    while (header.value) {
      headerObj[header.value] = headers.get(header.value);
      header = keys.next();
    }
  return headerObj;
};

Relaterte artikler