《TypeScript图形渲染实战：2D架构设计与实现》 —2.1.3 ES 6中的模板字符串

2.1.3  ES 6中的模板字符串

　　在此强调一下，使用ES 6中的模板字符串是很不错的一种体验。笔者认为ES 6模板字符串一个最大的优点是：可以一次定义多行字符串，并且保证空格和缩进，而单引号或双引号只能定义单行字符串。下面来看一下笔者经常使用的定义多行字符串的3种方式。

　　（1）在一行字符串中添加\n转义换行符，这种方式耗时又容易出错。具体代码如下：

let str1 : string = " numMeshes 5 \n /** \n * joints关键词定义了骨骼动画的

bindPose \n */ \n joints { \n 'origin'-1 ( 0 0 0 ) ( -0.5 -0.5 -0.5 )

\n 'Body'0 ( -12.1038131714 0 79.004776001 ) ( -0.5 -0.5 -0.5 ) // origin

\n } " ;

　　（2）使用+=符号拼接字符串，代码如下：

let str2: string = " numMeshes  5 " ;

            str2 += " /* " ;

            str2 += " * joints关键词定义了骨骼动画的bindPose " ;

            str2 += " */ " ;

            str2 += " joints { " ;

            str2 += "  'origin'  -1  ( 0 0 0 )  ( -0.5  -0.5  -0.5 ) " ;

            str2 += "  'Body'    0  ( -12.1038131714  0  79.004776001 ) 

            ( -0.5 -0.5 -0.5 )   // origin " ;

            str2 += " } " ;

　　（3）使用数组方式并调用join()函数将数组拼接成字符串，这种方式相对来说比较清晰，代码如下：

let str3: string = [

    " numMeshes  5 " ,

    " /* " ,

    " * joints关键词定义了骨骼动画的bindPose " ,

    " */ " ,

    " joints { " ,

        " 'origin'     -1  ( 0 0 0 )  ( -0.5  -0.5  -0.5 ) " ,

        " 'Body'      0  ( -12.1038131714  0  79.004776001 )  ( -0.5 -0.5 -0.5 )

        // origin " ,

    " } "

] . join( " \n " ) ; 

　　需要注意的是，以上3种方式中，处理字符串中的子字符串（例如orgin和Body）时，需要使用单引号引起来。

　　如果不考虑兼容性，并且当前的JavaScrit引擎支持ES 6标准的话，那么应尽量使用模板字符串。模板字符串还支持以${ }方式定义变量，具体的用法请读者自行查阅TypeScript或ES 6官方手册。