SOURCE

var template = function(tpl, data) {
  var re = /{{(.+?)}}/g,
  cursor = 0,
  reExp = /(^( )?(var|if|for|else|switch|case|break|{|}|;))(.*)?/g,
  code = 'var r=[];\n';
  // 解析html
  function parsehtml(line) {
    // 单双引号转义，换行符替换为空格,去掉前后的空格
    line = line.replace(/('|")/g, '\\$1').replace(/\n/g, ' ').replace(/(^\s+)|(\s+$)/g,"");
    code +='r.push("' + line + '");\n';
  }

  // 解析js代码		
  function parsejs(line) {   
    // 去掉前后的空格
    line = line.replace(/(^\s+)|(\s+$)/g,"");
    code += line.match(reExp)? line + '\n' : 'r.push(' + 'this.'+line + ');\n';
  }	

  while((match = re.exec(tpl))!== null) {
    // 开始标签  {{ 前的内容和结束标签 }} 后的内容
    parsehtml(tpl.slice(cursor, match.index))
    // 开始标签  {{ 和 结束标签 }} 之间的内容
    parsejs(match[1])
    // 每一次匹配完成移动指针
    cursor = match.index + match[0].length;
  }
  // 最后一次匹配完的内容
  parsehtml(tpl.substr(cursor, tpl.length - cursor));
  code += 'return r.join("");';
  return new Function(code.replace(/[\r\t\n]/g, '')).apply(data);
}

var tpl = document.getElementById("template").innerHTML.toString();
document.getElementById("content").innerHTML = template(tpl,{
  name: 'zhaomenghuan',
  profile: { 
    age: 24 
  },
  sex: 'man',
  skills: ['html5', 'javascript', 'android']
});

<div id="content"></div>
<script type="text/tpl" id="template">
  <p>name: {{name}}</p>
  <p>age: {{profile.age}}</p>
  {{ if (this.sex === 'man') { }}
    <p>sex: 男</p>
  {{ } else { }}
		<p>sex: 女</p>
	{{ } }}
	<p>skills:</p>
  <ul>
    {{ for (var i in this.skills) { }}
    <li>{{skills[i]}}</li>
    {{ } }}
  </ul>
</script>