如何深入理解20行代码构建的JavaScript模板引擎实例？

本文共计3274个文字，预计阅读时间需要14分钟。

原文：本文字例讲述了JavaScript模板引擎。

介绍JavaScript模板引擎的基本概念。

本文实例讲述了 JavaScript 模板引擎。分享给大家供大家参考，具体如下：

原文链接：JavaScript template engine in just 20 lines

（译者吐槽：只收藏不点赞都是耍流氓）

前言

我仍旧在为我的JS预处理器AbsurdJS进行开发工作。它原本是一个CSS预处理器，但之后它扩展成为了CSS/HTML预处理器，很快它将支持JS到CSS/HTML的转换。它就像一个模板引擎一样能够生成HTML代码，也就是说它能够用数据填充模板当中的标识片段。

因此，我希望去写一个可以满足我当前需求的模板引擎。AbsurdJS主要作为NodeJS的模块使用，但同时它也可以在客户端使用。为了这个目的，我无法使用市面上已经存在的模板引擎，因为它们几乎全都依赖于NodeJS，并且难以在浏览器中使用。我需要一个更小，纯JS写成的模板引擎。我浏览了这篇由John Resig写的博客，似乎这正是我需要的东西。我把当中的代码稍作修改，并且浓缩到了20行。

这段代码的运行原理非常有趣，我将在这篇文章中一步一步为大家展示John的wonderful idea。