为ecmascript做准备6：新的字符串方法 -​​ string.protype。

>在我的上一篇有关ES6数组方法的文章中，我介绍了与数组类型一起使用的Ecmascript 6中可用的新方法。在本教程中，您将了解与字符串一起使用的新ES6方法：String.Prototype。

>我们将开发几个示例，并提及可用于它们的多填充。请记住，如果您想使用一个库将它们全部填充，可以使用Paul Miller的ES6-Shim。

钥匙要点

eS6引入了几种用于字符串操作的新方法，包括string.prototype.startswith（），string.prototype.endswith（），string.prototype.includes（），strign.prototype.repeat（），and.raw（ ）。这些方法提供了更轻松，更有效的方法来检查字符串是否以给定的子字符串启动或结束，如果字符串包含某个子字符串，重复一个指定数量的字符串，以及处理模板字符串。

string.prototype.startswith（）和string.prototype.endswith（）中ES6中的方法允许您验证字符串是否以给定的子字符串启动或结束。他们既接受substring和位置作为参数，并根据字符串开始或以所提供的子字符串结束而返回true或false。
• 。
> string.prototype.includes（）方法ES6中的方法如果在另一个字符串中包含一个字符串，则无论位置如何，都会返回true。它接受与startswith（）和endswith（）方法相同的参数。
• > ES6中的String.prototype.repeat（）方法
string.prototype.startswith（）
>每个现代编程语言中最常用的功能之一是验证字符串是否以给定的子字符串开头的一种。在ES6之前，JavaScript没有这样的功能，这意味着您必须自己写。以下代码显示了开发人员通常如何填充它：

或，或者：

<span>if (typeof String.prototype.startsWith !== 'function') {
</span>  <span>String.prototype.startsWith = function (str){
</span>    <span>return this.indexOf(str) === 0;
</span>  <span>};
</span><span>}
</span>

这些片段仍然有效，但是它们并没有准确地重现新的可用string.prototype.startswith（）方法。新方法具有以下语法：

<span>if (typeof String.prototype.startsWith !== 'function') {
</span>  <span>String.prototype.startsWith = function (str){
</span>    <span>return this.substring(0, str.length) === str;
</span>  <span>};
</span><span>}
</span>

>您还可以看到，除了一个子字符串外，它还接受了第二个参数。搜索串参数指定要验证的子字符串是字符串的开始。位置表示启动搜索的位置。位置的默认值为0。如果字符串从提供的子字符串开始，则方法返回true，否则为false。请记住，该方法对情况很敏感，所以“ Hello”与“ Hello”不同。

>

此方法的一个示例用途如下：

<span>String.prototype.startsWith(searchString[, position]);
</span>

<span>if (typeof String.prototype.startsWith !== 'function') {
</span>  <span>String.prototype.startsWith = function (str){
</span>    <span>return this.indexOf(str) === 0;
</span>  <span>};
</span><span>}
</span>

>以下代码的实时演示如下所示，也可在JSBIN上找到。

> 除了Internet Explorer，该方法在节点和所有现代浏览器中都支持该方法。如果您需要支持较旧的浏览器，则可以在MDN的方法页面上找到该方法的多填充。 Mathias Bynens也开发了另一个多填充。

string.prototype.endswith（）> ecmascript 6介绍string.prototype.endswith（）方法。它验证字符串是否用给定的子字符串终止。如下所示，此方法的语法与string.prototype.startswith（）：

>非常相似。

如您所见，此方法接受与String.prototype.startswith（）相同的参数，并且还返回相同类型的值。

一个区别在于，位置参数使您可以在字符串中搜索，就好像字符串仅此字符串一样长。换句话说，如果我们有字符串房屋，并且使用'house'.endswith（'us'，4）称呼该方法，我们会获得True，因为这就像我们实际上有字符串Hous（请注意缺少的“ E”） 。

<span>if (typeof String.prototype.startsWith !== 'function') {
</span>  <span>String.prototype.startsWith = function (str){
</span>    <span>return this.substring(0, str.length) === str;
</span>  <span>};
</span><span>}
</span>

此方法的一个示例用途如下：

>以下片段的实时演示如下所示，也可以在JSBIN上找到。

除了Internet Explorer，该方法在节点和所有现代浏览器中都支持该方法。如果您需要支持较旧的浏览器，则可以在MDN的方法页面上找到该方法的多填充。 Mathias Bynens开发了另一个多填充。

string.prototype.includes（）

<span>String.prototype.startsWith(searchString[, position]);
</span>

>我们正在谈论验证另一个字符串是否包含在另一个字符中时，让我向您介绍string.prototype.includes（）方法。如果在另一个何处，另一个字符串包含在另一个，则返回true。

其语法如下所示：

>

参数的含义与string.prototype.startswith（）相同，因此我不会重复它们。此方法的示例用途如下：

>

>您可以在下面找到一个现场演示，也可以在JSBIN上找到。

> 除了Internet Explorer，

string.prototype.includes（）在节点和所有现代浏览器中都支持。如果您需要支持较旧的浏览器，就像本教程中讨论的其他方法一样，您可以找到Mathias Bynens提供的多填充（这个人知道如何做他的工作！），而在Mozilla开发人员网络上进行了另一种。

<span>const str = 'hello!';
</span><span>let result = str.startsWith('he');
</span>
<span>// prints "true"
</span><span>console.log(result);
</span>
<span>// verify starting from the third character
</span>result <span>= str.startsWith('ll', 2);
</span>
<span>// prints "true"
</span><span>console.log(result);
</span>

注意：在版本48之前，Firefox使用非标准名称包含。

string.prototype.repeat（）

<span>String.prototype.endsWith(searchString[, position]);
</span>

>现在让我们继续使用另一种类型的方法。 String.Prototype.repeat（）是一种返回一个新字符串的方法，该新字符串包含被调用但重复指定次数的相同字符串。该方法的语法为以下：

>

<span>if (typeof String.prototype.startsWith !== 'function') {
</span>  <span>String.prototype.startsWith = function (str){
</span>    <span>return this.indexOf(str) === 0;
</span>  <span>};
</span><span>}
</span>

时间参数指示必须重复字符串的次数。如果通过零，您将获得一个空字符串，而如果通过一个负数或无穷大，则会获得Rangeerror。

此方法的一个示例用途如下：

<span>if (typeof String.prototype.startsWith !== 'function') {
</span>  <span>String.prototype.startsWith = function (str){
</span>    <span>return this.substring(0, str.length) === str;
</span>  <span>};
</span><span>}
</span>

>以下代码的实时演示如下所示，也可以在JSBIN上找到。

> 除了Internet Explorer，该方法在节点和所有现代浏览器中都支持该方法。如果您需要支持较旧的浏览器，则可以为此方法提供两个polyfills：Mathias Bynens开发的一种和Mozilla Developer Network上的另一个。

> string.raw（）

我想在本教程中介绍的最后一个方法是string.raw（）。它被定义为

模板字符串的标签函数

。这很有趣，因为它是模板库的替代品，尽管我不确定它可以扩展足够的扩展以实际替换这些库。但是，这个想法基本上是与我们不久之后所看到的。它的作用是编译字符串并用提供的值替换每个占位符。>

它的语法为以下（请注意Backticks）：> TemplateString参数表示包含模板进行过程的字符串。

为了更好地理解这个概念，让我们看看一个具体的示例：>

>以下代码的实时演示如下所示，也可以在JSBIN上找到。

<span>String.prototype.startsWith(searchString[, position]);
</span>

>

除了Opera和Internet Explorer，该方法在节点和所有现代浏览器中都支持。如果您需要支持较旧的浏览器，则可以使用多填充，例如在NPM上可用的浏览器。

结论

在本教程中，您已经了解了与字符串一起使用的Ecmascript 6中引入的几种新方法。我们尚未涵盖的其他方法是string.fromcodepoint（），string.prototype.codepointat（）和string.prototype.normalize（）。希望您喜欢这篇文章，并且您将继续遵循我们的频道以了解有关Ecmascript6的更多信息。

<span>const str = 'hello!';
</span><span>let result = str.startsWith('he');
</span>
<span>// prints "true"
</span><span>console.log(result);
</span>
<span>// verify starting from the third character
</span>result <span>= str.startsWith('ll', 2);
</span>
<span>// prints "true"
</span><span>console.log(result);
</span>

经常询问有关ES6字符串方法的问题

>

>在ES6？

ES6中引入了哪些新的字符串方法，也称为Ecmascript 2015，引入了几种新的字符串方法，以使字符串操作更加容易，更有效。其中包括诸如startswith（），endswith（），include（），repot（）和模板文字之类的方法。 startswith（）方法检查字符串是否以指定的字符串开头，而endSwith（）检查字符串是否以指定的字符串结束。 Incluber（）方法检查字符串是否包含指定的字符串。重复（）方法重复一个指定数量的字符串。模板文字允许您使用$ {}语法将表达式嵌入字符串文字中。

> startswith（）方法如何在ES6？

中起作用ES6中的startswith（）方法用于确定字符串是否从指定字符串的字符开始。如果字符串从指定的字符串开始，则返回true，否则为false。语法是str.startswith（搜索string [，position]）。搜索串是在Str开始时要搜索的字符。可选的位置是搜索启动的字符串中的位置。如果省略，搜索将从字符串的开头开始。

>

eS6？

中的endswith（）方法是什么？带有指定字符串的字符。如果字符串以指定的字符串结束，则返回true。语法是str.endswith（搜索string [，lenth]）。搜索串是在Str结束时要搜索的字符。可选的长度是要搜索的字符串的长度。如果省略，使用字符串的长度。在另一个字符串中找到。如果字符串包含指定的字符串，则返回true。语法为str.crudes（searchstring [，位置]）。搜索串是要搜索的字符串。可选的位置是在开始搜索的字符串中的位置。如果省略，则搜索从字符串的开头开始。

>

eS6？

中的重复（）方法是什么？指定数量的字符串副本被称为串联在一起。语法是str.repeat（count），其中计数是重复字符串的次数。计数必须在0到无穷大之间，而不是一个负数。

模板文字如何在es6？

eS6中的模板文字中起作用。您可以在其中使用多行字符串和字符串插值功能。它们是由Backtick（）字符而不是双引号或单个引号所包围的。模板文字可以包含占位符，以美元标志和卷曲括号表示（$ {expression}）。占位符和它们之间的文字中的表达式传递给函数。

> ）方法用于检查字符串是否包含指定的字符串。但是，它们之间有一个关键区别。 Incluber（）方法返回一个布尔值 - 如果字符串包含指定的字符串，则否则为false。另一方面，索引（）方法返回指定字符串的第一次出现的索引，如果找不到字符串，则返回-1。

>我可以在所有浏览器中使用ES6字符串方法吗？但是，对于不支持ES6的较旧浏览器，您可能需要使用像Babel这样的转板器将ES6代码转换为ES5，该代码得到了更广泛的支持。

>我如何使用带有数组的ES6字符串方法？

一些ES6字符串方法可以与数组一起使用。例如，Incluber（）方法可用于确定数组是否包含某个元素。但是，并非所有字符串方法都适用于数组。重要的是要了解每种方法的特定用途和局限性。

ES6？

>在ES6中标记为标记的模板文字是更高级的模板文字形式。使用标记模板，您可以用功能解析模板文字。标签函数的第一个参数包含字符串值数组。其余的论点与表达式有关。然后，标签函数可以在这些参数上执行操作并返回操纵字符串。

>

以上是为ecmascript做准备6：新的字符串方法 -​​ string.protype。的详细内容。更多信息请关注PHP中文网其他相关文章！