6、使用 TypeScript 构建 Markdown 编辑器

使用 TypeScript 构建 Markdown 编辑器

1. 使用 Markdown 文档表示转换后的 Markdown

在解析内容时，需要一种机制来存储解析过程中创建的文本。直接使用全局字符串并直接更新它会有问题，尤其是在后续异步添加内容时。不使用字符串的主要原因是遵循单一职责原则。如果使用简单字符串，添加到文本的每段代码都需要以正确的方式写入字符串，这会导致将读取 Markdown 与写入 HTML 输出混合在一起。因此，需要一个单独的方式来写入 HTML 内容。

首先定义一个接口：

interface IMarkdownDocument {
    Add(...content : string[]) : void;
    Get() : string;
}

然后创建 MarkdownDocument 类：

class MarkdownDocument implements IMarkdownDocument {
    private content : string = "";
    Add(...content: string[]): void {
        content.forEach(element => {
            this.content += element;
        });
    }
    Get(): string {
        return this.content;