Question

我有一本书，里面有我要展示的脚注。我把脚注放在大括号里面。

为了检索注释并在不同的窗口中显示它们，我在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

我已经设置了一个省略http.get的测试Angular Plunker。正则表达式的速度看起来很好，没有图中的可观察性。

我查看了从右到左的方面，但无法看到它如何影响正则表达式。在任何情况下，我都使用?保留正则表达式，因为我注意到有人发布了RTL需要延迟评估。

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

注意

var array= regexp.exec(this.book);仅返回第一场比赛。要使用此语法，您需要循环直到不再匹配。所以我使用了更快的this.book.match(re)。

＆＃13;

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));

＆＃13;

在Angular中使用长文本的RegExp函数

1 个答案: