3

模板字符串用途

  1. 取变量

       var name = "liyang";
       var age = 23;
       console.log(`I am ${name},I ${age} years old`)
    

    clipboard.png

     如果想用到反引号,用斜杠转义
       var name = "liyang";
       var age = 23;
       console.log(`I \`\`am ${name},I ${age} years old`)
    

    clipboard.png

  2. 展示多行字符串

       $('#root').html(`
           <ul>
               <li>一</li>
               <li>二</li>
               <li>三</li>
           </ul>
       `)
      
    

    clipboard.png

    <ul>标签前面会有一个换行。如果想把行首和行尾的换行、空格等去掉,则使用trim方法。

           $('#root').html(`
           <ul>
               <li>一</li>
               <li>二</li>
               <li>三</li>
           </ul>
       `.trim())
    
  3. 嵌入变量的多种使用方式

    var  x= 1, y = 2;
    console.log(`${x} + ${y} = ${x + y}`)
    

    clipboard.png

    var x= 1, y = 2;
    console.log(${x} + ${y * 2} = ${x + y * 2})

    clipboard.png

    var obj = {x:1,y:2};
    console.log(${obj.x + obj.y});

    clipboard.png

  4. 调用函数

    function func(){
      return 'Hello';
    }
    console.log(`${func()} World`);
    

    clipboard.png


李钢铁
830 声望47 粉丝

简单粗暴