Angular中带有长文本的RegExp函数

Question

我有一本带脚注的书，我想展示它。 我将脚注放在大括号内。

为了检索 cmets 并将它们显示在不同的窗口中，我在 Angular 2 中编写了以下类：

export class BookreaderComponent implements OnInit {

comments() {
    var regexp = new RegExp('\{(\s*?.*?)*?\}');
    var array= regexp.exec(this.book);
    console.log(array);
  }

  constructor(public appServices: AppServices, private http: Http, private route: ActivatedRoute) { }
  book: string;
  Name: string;
  json: string;
  ngOnInit() {
    this.route.params.subscribe(params => {
      this.Name = params['name'];
      this.http.get("./assets/" + params['url'])
        .map(ref => {
          return ref;
        }).subscribe(ref => {
          this.book = ref.text();
          this.comments();
        });
    });

  }

该类调用comments 函数，该函数对包含大量大括号文本的大量文本调用正则表达式函数。问题是正则表达式函数加载时间很长（我等了又等，它没有加载），同时整个页面都卡住了。

有没有办法加快这个速度，或者把它分解成更小的块？或者我应该尝试不同的方式来显示这些脚注？

Answer 1

我设置了一个测试Angular Plunker，它省略了http.get。没有图片中可观察的，正则表达式的速度看起来不错。

我查看了从右到左的方面，但看不到它如何影响正则表达式。无论如何，我将正则表达式保留为 ?，因为我注意到有人发布 RTL 需要惰性求值。

此外，大多数 RTL 语言讨论似乎都集中在 CSS 标签上，所以我想知道 RTL 是否会产生任何影响。毕竟，它仍然是一个字符串？您能否提供一个 RTL 的简短示例，以便我澄清我的想法。

注意

var array= regexp.exec(this.book); 只返回第一个匹配项。要使用此语法，您需要循环直到不再有匹配项。所以我改用this.book.match(re)，它更快。

const getMockBook = () => {
  const line = 'Here is some text with a {comment} in it';
  const lineCount = 2000;
  const book = (new Array(lineCount)).join(line);
  return book;
}

const comments1 = (book) => {
  const start = new Date();
  const regexp = new RegExp('\{(\s*?.*?)*?\}', 'g');
  const array= regexp.exec(book);
  return `elapsed: ${(new Date()) - start}, size: ${book.length}, matches: ${array.length}`
}

const comments2 = (book) => {
  const start = new Date();
  const re = /{(\s*?.*?)*?}/g
  const array= book.match(re);
  return `elapsed: ${(new Date()) - start}, size: ${book.length}, matches: ${array.length}`
}

const book = getMockBook();
console.log(comments1(book));
console.log(comments2(book));