标签模板函数

62 阅读 0 评论 41 点赞

我是靠谱客的博主执着狗，最近开发中收集的这篇文章主要介绍标签模板函数，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

模板字符串的功能，不仅仅是上面这些。它可以紧跟在一个函数名后面，该函数将被调用来处理这个模板字符串。这被称为“标签模板”功能（tagged template）。

模板字符串（template string）是增强版的字符串，用反引号（`）标识。它可以当作普通字符串使用，也可以用来定义多行字符串，或者在字符串中嵌入变量。

 1     // 标签模板函数
 2      function passthru(strings){
 3             var result = '';
 4             var i = 0;
 5             while(i < strings.length){
 6                 result += strings[i++];
 7                 if(i < arguments.length){
 8                     result += arguments[i];
 9                 }
10             }
11             return result;
12     }
13     var total = 30;
14     var msg = passthru`The total is ${total} (${total*1.05} with tax)`;
15     document.write(msg+'<br>');

 1     // String.raw()函数
 2     String.raw = function(strings, ...values){
 3         var result = '';
 4         for(var index = 0; index < values.length; index++){
 5             result += strings.raw[index] + values[index];
 6         }
 7         result += strings.raw[index];
 8         return result;
 9     }
10     var s = String.raw({ raw: 'test' }, 0, 1, 2);
11     var s2 = String.raw({ raw: ['t','e','s','t'] }, 0, 1, 2);
12     document.write(s,' '+s2);