ES6现在：模板字符串

> ES6模板文字：一种现代的JavaScript字符串

的方法

键突出显示：

eS6（Ecmascript 2015）显着增强了JavaScript，引入了对现代网络开发至关重要的功能。
• 模板文字，使用Backticks（`）作为定界器，在JavaScript中彻底改变了字符串处理。 它们启用嵌入式表达式和多行字符串。
• >标签函数可以预先到模板字面上，从而允许所得字符串的自定义处理（例如，URL编码）。
ES6虽然在现代浏览器中得到广泛支持，但可以将ES6转移到ES5的较旧浏览器中。 功能检测确保兼容性。
• （本文是Microsoft Web开发系列的一部分。感谢我们的合作伙伴支持SitePoint。） ES6是JavaScript的当前和未来。 该系列探讨了其最有用的功能。 我的编码样式始终使用单弦的单语引号，在html字符串构造中提供优势：

避免逃脱字符可提高可读性。 虽然HTML灵活，但优先考虑人类可读代码是关键。 我从过去的经验中学到了DHTML的复杂性，以欣赏更清洁的解决方案。

表达式替代和增强的可读性：

>

>我对单引号的偏爱源于我的php背景，它们阻止了可变的替代，从而提高了性能。 JavaScript以前缺乏此功能，需要字符串串联：

<code class="language-javascript">// Single quotes simplify HTML attribute quoting
var buttonText = 'Save'; </code>

>这变得笨重，串起较长，并且通常导致绒毛错误。 JavaScript缺乏本地多行字符串进一步使事情变得复杂。

模板文字：解决方案：> ES6模板文字解决了这些问题。 反向（`）允许表达替代和多行字符串：

>

构造处理任何JavaScript表达式，启用计算和对象属性访问：

<code class="language-javascript">var animal = 'cow';
var sound = 'moo';

alert('The animal is ' + animal + ' and its sound is ' + sound); </code>

多行字符串现在毫不费力：

>标记模板：

模板文字可以用函数“标记”，启用自定义字符串操纵：

<code class="language-javascript">var animal = 'cow';
var sound = 'moo';

alert(`The animal is ${animal} and its sound is ${sound}`);</code>

${}此函数将字符串作为参数接收，允许诸如URL编码之类的操作。。

<code class="language-javascript">var output = `ten times two is ${10 * 2}`;</code>

>访问标签函数中的字符串部分：

>

标签函数同时接收字符串零件和嵌入式表达式作为单独的参数：>

<code class="language-javascript">var list = `
- Buy Milk
- Be kind to Pandas
- Forget about Dre
`;</code>

属性提供了原始的字符串部分，包括逃生序列。>

>浏览器兼容性和功能检测：

>

>大多数现代浏览器都支持模板文字，但对于较旧的浏览器来说，ES6转卸（例如，使用Babel）是必需的。 功能检测确保兼容性：

<code class="language-javascript">// Single quotes simplify HTML attribute quoting
var buttonText = 'Save'; </code>

>进一步的阅读和资源：（省略了简短的链接，但原始文本包含了指向模板文字的各种文章的链接。）

Microsoft Web开发系列：

>（有关Microsoft的Web开发资源（包括工具和学习材料）的详细信息，包括在原始文本中，但此处省略了。）

>

常见问题：（原始文本包含模板文字上的全面常见问题解答部分，由于长度约束，此处省略了。）

以上是ES6现在：模板字符串的详细内容。更多信息请关注PHP中文网其他相关文章！