admin管理员组

文章数量:1287246

Consider this basic AsyncIterator Example from MDN:

var asyncIterable = {
  [Symbol.asyncIterator]() {
    return {
      i: 0,
      next() {
        if (this.i < 3) {
          return Promise.resolve({ value: this.i++, done: false });
        }

        return Promise.resolve({ done: true });
      }
    };
  }
};

(async function() {
   for await (let num of asyncIterable) {
     console.log(num);
   }
})();

Running this on node 10.16.0 works fine. However, I cannot seem to make it run via Typescript. Using this tsconfig:

{
  "pilerOptions": {
    "lib": ["es2016", "esnext.asynciterable"],
    "target": "es2016"
  }
}

results in error The type returned by the 'next()' method of an async iterator must be a promise for a type with a 'value' property. Same error for target esnext.

If I remove the target option entirely, I get a Type '{ [Symbol.asyncIterator](): { i: number; next(): Promise<{ done: boolean; }>; }; }' is not an array type or a string type.

The TS manual mentions several caveats, none of which could solve my problem. Oddly enough, iterating async generators works fine.

Which tsconfig options are required to make this example pile?

Consider this basic AsyncIterator Example from MDN:

var asyncIterable = {
  [Symbol.asyncIterator]() {
    return {
      i: 0,
      next() {
        if (this.i < 3) {
          return Promise.resolve({ value: this.i++, done: false });
        }

        return Promise.resolve({ done: true });
      }
    };
  }
};

(async function() {
   for await (let num of asyncIterable) {
     console.log(num);
   }
})();

Running this on node 10.16.0 works fine. However, I cannot seem to make it run via Typescript. Using this tsconfig:

{
  "pilerOptions": {
    "lib": ["es2016", "esnext.asynciterable"],
    "target": "es2016"
  }
}

results in error The type returned by the 'next()' method of an async iterator must be a promise for a type with a 'value' property. Same error for target esnext.

If I remove the target option entirely, I get a Type '{ [Symbol.asyncIterator](): { i: number; next(): Promise<{ done: boolean; }>; }; }' is not an array type or a string type.

The TS manual mentions several caveats, none of which could solve my problem. Oddly enough, iterating async generators works fine.

Which tsconfig options are required to make this example pile?

Share Improve this question asked Jul 16, 2019 at 18:31 panepeterpanepeter 4,2523 gold badges36 silver badges48 bronze badges 7
  • Nope, unfortunately not. – panepeter Commented Jul 16, 2019 at 18:45
  • Well, { done: true } doesn't have a .value property. – Bergi Commented Jul 16, 2019 at 19:14
  • @Bergi right but it shouldn't have to, at least it isn't required by the ECMAScript specification... I wish that object had been defined with type IteratorResult<T> = { value: T; done: boolean; } | { value?: undefined; done: true; } – Patrick Roberts Commented Jul 16, 2019 at 19:23
  • @PatrickRoberts I think it's a good practice to always return objects of the same shape nonetheless. – Bergi Commented Jul 16, 2019 at 19:32
  • @Bergi would you count { value: undefined, done: true } the same shape as { value: i++, done: false }? – Patrick Roberts Commented Jul 16, 2019 at 19:50
 |  Show 2 more ments

1 Answer 1

Reset to default 9

After digging a little further into the problem, it appears it is due to multiple issues here.

The async iterator can't rely on its context (e.g. this.i) to access properties that are not part of the AsyncIterator interface. Doing so will not pile in the current version of TypeScript 3.6 (even if it works fine in JavaScript), so to work around that we are left with:

var asyncIterable = {
  [Symbol.asyncIterator]() {
    let i = 0;
    return {
      next() {
        if (i < 3) {
          return Promise.resolve({ value: i++, done: false });
        }

        return Promise.resolve({ done: true });
      }
    };
  }
};

Now the problem appears to be related to value missing in the second return statement. Because the IteratorResult interface is defined like this:

interface IteratorResult<T> {
  done: boolean;
  value: T;
}

the next() method must always return an object with value: number (again, even if it works fine in JavaScript), so finally we have:

var asyncIterable = {
  [Symbol.asyncIterator]() {
    let i = 0;
    return {
      next() {
        if (i < 3) {
          return Promise.resolve({ value: i++, done: false });
        }

        return Promise.resolve({ value: i, done: true });
      }
    };
  }
};

本文标签: javascriptUse AsyncIterator in Typescript – required optionsStack Overflow