美文网首页
es6学习笔记(二)----模板

es6学习笔记(二)----模板

作者: 夜雨惊人 | 来源:发表于2017-09-20 16:26 被阅读0次
    • 模板字符串
      • es6中采用反引号(`)标识,他可以当做普通字符串来使用,也可以用来定义多行字符串,或在字符串嵌入变量
      • 注:
      • 当模板中出现反引号时则需要转译符。
      • 在使用模板字符串表示多行字符,所有的空格和缩进都会保留在输出之中。若要消除换行,可以使用trim
      • 模板中嵌入的变量名必须写在${}之中。
      • 模板字符串中还可以调用函数。
      • 模板字符串可以嵌套。
    // 传统写法
    $('#result').append(
      ' There are <b> ' + basket.count + ' </b> ' +
      ' items in your basket, ' + 
      ' <em> ' + basket.onSale +
      ' </em> are on sale! ' 
    );
    
    // es6写法
    $('#result').append(`
       There are <b> $ { basket.count }</b> 
       items in your basket, 
      <em> ${  basket.onSale } 
      </em> are on sale! 
    `);
    
    • 标签模板:
    • 说明:标签模板其实并不是模板,是函数的一种特殊形式。“标签”指的是函数,紧跟在后面的模板字符串就是他的参数。
      alert`123`
    // 等同于
      alert(123)
    
    function tag(stringArr, value1, value2){}
    // =
    function tag(stringArr, ...values){}
    
    var a = 5 ;
    var b = 10;
    tag`Hello ${ a+b } world ${ a*b }`;
    // =
    tag(['Hello', 'world', ' '],15,50);
    

    相关文章

      网友评论

          本文标题:es6学习笔记(二)----模板

          本文链接:https://www.haomeiwen.com/subject/tzhajxtx.html