模板字符串

thekingisalwaysluc 发布于2019-08-23 18:22 / 3359人阅读

摘要：模板字符串用途取变量如果想用到反引号，用斜杠转义展示多行字符串一二三标签前面会有一个换行。如果想把行首和行尾的换行空格等去掉，则使用方法。一二三嵌入变量的多种使用方式调用函数

模板字符串用途

取变量

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

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

展示多行字符串

   $("#root").html(`
       
           一
           二
           三
       
   `)

       $("#root").html(`
       
           一
           二
           三
       
   `.trim())

嵌入变量的多种使用方式

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

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

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

调用函数

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

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/105115.html

字符串与JavaScript之间的魔术—前端模板的原理及简单实现

摘要：大多数模板实现原理基本一致模板字符串首先通过各种手段剥离出普通字符串和模板语法字符串生成抽象语法树然后针对模板语法片段进行编译，期间模板变量均去引擎输入的变量中查找模板语法片段生成出普通片段，与原始普通字符串进行拼接输出。前端模板的发展模板可以说是前端开发最常接触的工具之一。将页面固定不变的内容抽出成模板，服务端返回的动态数据装填到模板中预留的坑位，最后组装成完整的页面html字符...

Steve_Wang_ 2019-08-23 11:42 评论0 收藏0
手把手教你从零写一个简单的 VUE--模板篇

摘要：转换成为模板函数联系上一篇文章，其实模板函数的构造都大同小异，基本是都是通过拼接函数字符串，然后通过对象转换成一个函数，变成一个函数之后，只要传入对应的数据，函数就会返回一个模板数据渲染好的字符串。教程目录1.手把手教你从零写一个简单的 VUE2.手把手教你从零写一个简单的 VUE--模板篇 Hello，我又回来了，上一次的文章教会了大家如何书写一个简单 VUE，里面实现了VUE 的...

feng409 2019-08-21 11:52 评论0 收藏0
前端防XSS攻击——模板字面量（模板字符串）之模板标签的应用

摘要：如例子中，内容被分割为三部分，以及最后空白的存放模板字面量中的第一个变量。如果我们对要上传至服务器的内容先进行过滤，则可能可以防止这种情况发生。本篇先简单介绍模板字面量及标签模板，再引出其应用——防止XSS攻击一.简介模板字面量（即模板字符串，MDN已更新为模板字面量的说法，此文以后都用模板字面量） ES6中引入了模板字面量来代替传统JS的输出模板，直接看代码最清楚吧模板字面量（...

nifhlheimr 2019-08-26 12:21 评论0 收藏0
[总结] js 模板引擎

摘要：第三部分介绍一种模板引擎，之所以介绍他是因为。。。。三简介模板引擎是数据与界面分离工作中最重要一环。是新一代模板引擎，它采用预编译方式让性能有了质的飞跃，并且充分利用引擎特性，使得其性能无论在前端还是后端都有极其出色的表现。嗯，这也是一个学习笔记，材料均来自网络，有改动。。文章主要分为三部分，第一部分通过实现一个简易的ERB模板引擎来介绍其原理，参考javascript模板引擎和实现...

airborne007 2019-08-19 18:42 评论0 收藏0