只有20行Javascript代码!手把手教你写一个页面模板引擎.pdfVIP

Javascript Web AbsurdJS CSS CSS HTMLJavascript CSS HTML HTML AbsurdJS NodeJS NodeJS Javascript John Resig 20 John 1. var TemplateEngine = function (tpl, data) { 2. // magic here ... 3. } 4. var template = pHello, my name is %name%. I\m %age% years ol d./p; 5. console.log(TemplateEngine(template, { 6. name: Krasimir, 7. age: 29 8. })); 1. pHello, my name is Krasimir. Im 29 years old./p 1. var re = /%([^%]+)?%/g; %%g global Javascript exec 1. var re = /%([^%]+)?%/g; 2. var match = re.exec(tpl); console.log match 1. [ 2. %name%, 3. name , 4. index: 21, 5. input: 6. pHello, my name is %name%. I\m %age% years old./p 7. ] while 1. var re = /%([^%]+)?%/g; 2. while (match = re.exec(tpl)) { 3. console.log(match); 4. } %name% %age% replace 1. var TemplateEngine = function (tpl, data) { 2. var re = /%([^%]+)?%/g; 3. while (match = re.exec(tpl)) { 4. tpl = tpl.replace(match[0], data[match[1]]) 5. } 6. return tpl; 7. } data[property] data 1. { 2. name: Krasimir Tsonev, 3. profile: { age: 29 } 4. } %profile.age% data[‘profile.age’]undefinedreplace %%Javascript 1. var template = pHello, my name is %this.name%. I\m %this.prof ile.age% years old./p; John new Function 1. var fn = new Function(arg, console.log(arg + 1);); 2. fn(2); // outputs 3 fn console.log(ar