Typescript 中的同步和异步代码答案

【问题标题】：Synchronous and Asynchronous Code in TypescriptTypescript 中的同步和异步代码
【发布时间】：2019-10-13 10:40:44
【问题描述】：

我是 Typescript 的新手，正在尝试了解如何更好地在 TS 中构建代码。

基本上，我计划有一个 FileReader 类（同步）和一个 ApiFileReader 类（异步），它们都继承自 Reader 类。我喜欢 ApiFileReader 和 FileReader 能够将它们的返回值转储到数据变量中，该变量可以是字符串或帖子数组，我可以通过调用继承类的 data 属性来访问这些变量。这是可能的，因为一个是同步的，另一个是异步的？使用 Typescript 构建此类同步和异步代码的最佳方式是什么？

我尝试了以下构建代码的方法，但它是错误的。在 index.ts 文件中，apiFileReader.data 返回一个空数组，而不是一个填充了帖子的数组

感谢那些有 Typescript 经验的人可以在这个问题上提供一些指导。在此先感谢

Index.ts

import { ApiFileReader } from "./inheritance/ApiFileReader";

//! API FILE READER
const apiFileReader = new ApiFileReader();

apiFileReader.readDataAsync();
console.log(apiFileReader.data); // returns an empty array

ApiFileReader.ts

import axios from "axios";

import { Reader } from "./Reader";
import { Post } from "./types/Post";

export class ApiFileReader extends Reader {
  data: Post[] = [];

  async readDataAsync(): Promise<boolean> {
    try {
      const res = await axios.get("https://jsonplaceholder.typicode.com/posts");
      console.log("res ", res);
      this.data = res.data;
      return true;
    } catch (error) {
      return false;
    }
  }

  logData(): void {}
}

FileReader.ts

import fs from "fs";

import { Reader } from "./Reader";

export class CustomFileReader extends Reader {
  data: string = "";

  logData(): void {
    this.data = fs.readFileSync("note.doc", "utf-8");
  }
}

Reader.ts

import { Post } from "./types/Post";

export abstract class Reader {
  abstract data: string | Post[];

  abstract logData(): void;
}

【问题讨论】：

标签： typescript

【解决方案1】：

这可能吗，因为一个是同步的，另一个是异步的？使用 Typescript 构建此类同步和异步代码的最佳方式是什么？

你可以让这两个函数异步，这样它们都会返回一个 Promise。使用同步代码的函数将返回已经解析的 Promise，例如return Promise.resolve(your-sync-data).

其实你甚至不需要这样做，只需用async关键字标记同步代码即可：

async function f() {
  return 5;              // what actually gets returned:  return Promise.resolve(5);
}
f().then(data => console.log(data));      // prints 5

我尝试了以下构建代码的方法，但它是错误的。在 index.ts 文件中，apiFileReader.data 返回一个空数组，而不是一个填充了帖子的数组

这段代码

apiFileReader.readDataAsync();

不等待readDataAsync() 返回的 Promise。而不是等待它立即执行

console.log(apiFileReader.data); // returns an empty array

并且数组是空的，因为数据还没有。

【讨论】：