关于ES6字符串的扩展详解

目录
  • 一、字符串的扩展
    • 字符的 Unicode 表示法
    • 字符串的遍历器接口
    • 模板字符串
  • 二、字符串的新增方法
    • includes(), startsWith(), endsWith()
    • 实例方法：repeat()
    • 实例方法：padStart()，padEnd()
    • 实例方法：trimStart()，trimEnd()
  • 总结

一、字符串的扩展

字符的 Unicode 表示法

ES6 加强了对 Unicode 的支持，允许采用\uxxxx形式表示一个字符，其中xxxx表示字符的 Unicode 码点。

"\u0061"
// "a"

字符串的遍历器接口

ES6 为字符串添加了遍历器接口（详见《Iterator》一章），使得字符串可以被for...of循环遍历。

for (let codePoint of 'foo') {
  console.log(codePoint)
}
// "f"
// "o"
// "o"

模板字符串

传统的 JavaScript 语言，输出模板通常是这样写的（下面使用了 jQuery 的方法）。

$('#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!
`);

二、字符串的新增方法

includes(), startsWith(), endsWith()

传统上，JavaScript 只有indexOf方法，可以用来确定一个字符串是否包含在另一个字符串中。ES6 又提供了三种新方法。

includes()：返回布尔值，表示是否找到了参数字符串。
startsWith()：返回布尔值，表示参数字符串是否在原字符串的头部。
endsWith()：返回布尔值，表示参数字符串是否在原字符串的尾部。\

let s = 'Hello world!';

s.startsWith('Hello') // true
s.endsWith('!') // true
s.includes('o') // true

这三个方法都支持第二个参数，表示开始搜索的位置。

let s = 'Hello world!';

s.startsWith('world', 6) // true
s.endsWith('Hello', 5) // true
s.includes('Hello', 6) // false

实例方法：repeat()

repeat方法返回一个新字符串，表示将原字符串重复n次。

'x'.repeat(3) // "xxx"
'hello'.repeat(2) // "hellohello"
'na'.repeat(0) // ""

实例方法：padStart()，padEnd()

ES2017 引入了字符串补全长度的功能。如果某个字符串不够指定长度，会在头部或尾部补全。padStart()用于头部补全，padEnd()用于尾部补全。

'x'.padStart(5, 'ab') // 'ababx'
'x'.padStart(4, 'ab') // 'abax'

'x'.padEnd(5, 'ab') // 'xabab'
'x'.padEnd(4, 'ab') // 'xaba'

实例方法：trimStart()，trimEnd()

ES2019 对字符串实例新增了trimStart()和trimEnd()这两个方法。它们的行为与trim()一致，trimStart()消除字符串头部的空格，trimEnd()消除尾部的空格。它们返回的都是新字符串，不会修改原始字符串。

const s = '  abc  ';

s.trim() // "abc"
s.trimStart() // "abc  "
s.trimEnd() // "  abc"

总结

到此这篇关于ES6字符串扩展的文章就介绍到这了,更多相关ES6字符串扩展内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • es6 字符串String的扩展(实例讲解)

    新特性:模板字符串 传统字符串 let name = "Jacky"; let occupation = "doctor"; //传统字符串拼接 let str = "He is "+ name +",he is a "+ occupation; es6简洁的字符串拼接 let name = "Jacky"; let occupation = "doctor"; //模板字符串拼接 le

  • JavaScript中ES6字符串扩展方法

    es6这个String对象倒是扩展了不少方法,但是很多都是跟字符编码相关,个人选了几个感觉比较常用的方法: includes 搜索字符的神器 还记得我们之前如何判断某个字符串对象是否包含特地字符的吗? var str='google'; if(str.indexOf('o')>-1){ console.log('yes'); }else{ console.log('no'); } indexOf本来只是一个获取字符对应位置的方法,因为找到不到会返回-1这个值,就成了判断是否包含的方法,inclu

  • ES6基础语法之字符串扩展

    一.字符串的遍历 JS中遍历字符串: var str = "hello,world"; for(var i = 0;i<str.length;i++) { console.log(str[i]); } ES6扩展的遍历字符串方法: let str = "hello,world"; for(let c of str) { console.log(c); } 二.字符串识别.重复.补全 字符串识别: ES6 之前判断字符串是否包含子串,用 indexOf 方法,E

  • ES6新特性之字符串的扩展实例分析

    本文实例讲述了ES6新特性之字符串的扩展.分享给大家供大家参考,具体如下: 一.ES5字符串函数 concat: 将两个或多个字符的文本组合起来,返回一个新的字符串. indexOf: 返回字符串中一个子串第一处出现的索引(从左到右搜索).如果没有匹配项,返回 -1 . charAt: 返回指定位置的字符. lastIndexOf: 返回字符串中一个子串最后一处出现的索引(从右到左搜索),如果没有匹配项,返回 -1 . match: 检查一个字符串匹配一个正则表达式内容,如果么有匹配返回 nul

  • ES6中字符串的使用方法扩展

    字符的Unicode表示法 JavaScript允许采用\uxxxx形式表示一个字符,其中"xxxx"表示字符的码点. "\u0061" // "a" 但是,这种表示法只限于\u0000--\uFFFF之间的字符.超出这个范围的字符,必须用两个双字节的形式表达. "\uD842\uDFB7" // "

  • ES6字符串的扩展实例

    本节我们来学习 ES6 中字符串类型的扩展,包括一些字符串对象的新增方法的使用等. 字符的 Unicode 表示法 ES6 加强了对 Unicode 的支持,JavaScript 中可以采用 \\uxxx 形式表示一个字符,其中 xxxx 表示字符的码点.例如: console.log("\u0075"); // u 但是这种表示法只限于码点在 \\u0000~\\uFFFF 之间的字符.超出这个范围的字符,必须用两个双字节的形式表示. console.log("\uD842

  • 关于ES6字符串的扩展详解

    目录 一.字符串的扩展 字符的 Unicode 表示法 字符串的遍历器接口 模板字符串 二.字符串的新增方法 includes(), startsWith(), endsWith() 实例方法:repeat() 实例方法:padStart(),padEnd() 实例方法:trimStart(),trimEnd() 总结 一.字符串的扩展 字符的 Unicode 表示法 ES6 加强了对 Unicode 的支持,允许采用\uxxxx形式表示一个字符,其中xxxx表示字符的 Unicode 码点.

  • ES6数组的扩展详解

    本文实例讲述了ES6数组的扩展.分享给大家供大家参考,具体如下: 1. Array.from() Array.from()将类数组(array-like)对象与可遍历的对象转化为数组并返回. 下面是一个类数组 let arr = { '0':'a', '1':'b', '2':'c', length:3 }; ES5我们可能都会这样写: var arr1=[].slice.call(arr); ES6可以把一个类数组转化为一个真正的数组 var arr2=Array.from(arr) 实际应用

  • Java字符串编码知识点详解介绍

    在 Java 中,当我们处理String时,有时需要将字符串编码为特定字符集.编码是一种将数据从一种格式转换为另一种格式的方法.字符串对象使用 UTF-16 编码.UTF-16 的问题在于它不能被修改.只有一种方法可以用来获得不同的编码,即 byte[] 数组.如果我们得到意外的数据,编码的方式是不合适的.在本节中,我们将学习如何在Java中对字符串进行编码. 在继续本节之前,我们必须了解字符编码.让我们快速浏览一下.让我们了解为什么我们需要对字符串进行编码. 字符编码是一种将文本数据转换为二进

  • IOS开发之字典转字符串的实例详解

    IOS开发之字典转字符串的实例详解 在实际的开发需求时,有时候我们需要对某些对象进行打包,最后拼接到参数中 例如,我们把所有的参数字典打包为一个 字符串拼接到参数中 思路:利用系统系统JSON序列化类即可,NSData作为中间桥梁 //1.字典转换为字符串(JSON格式),利用 NSData作为桥梁; NSDictionary *dic = @{@"name":@"Lisi",@"sex":@"m",@"tel&qu

  • 基于Java中字符串内存位置详解

    前言 之前写过一篇关于JVM内存区域划分的文章,但是昨天接到蚂蚁金服的面试,问到JVM相关的内容,解释一下JVM的内存区域划分,这部分答得还不错,但是后来又问了Java里面String存放的位置,之前只记得String是一个不变的量,应该是要存放在常量池里面的,但是后来问到new一个String出来应该是放到哪里的,这个应该是放到堆里面的,后来又问到String的引用是放在什么地方的,当时傻逼的说也是放在堆里面的,现在总结一下:基本类型的变量数据和对象的引用都是放在栈里面的,对象本身放在堆里面,

  • js-FCC算法-No repeats please字符串的全排列(详解)

    把一个字符串中的字符重新排列生成新的字符串,返回新生成的字符串里没有连续重复字符的字符串个数.连续重复只以单个字符为准 例如, aab 应该返回 2 因为它总共有6中排列 (aab, aab, aba, aba, baa, baa),但是只有两个 (aba and aba)没有连续重复的字符 (在本例中是 a). 从网上资料获得了一些思路,我的代码: function permAlone(str) { var arr=str.split(""); var perarr=[]; var

  • Python字符串处理实例详解

    Python字符串处理实例详解 一.拆分含有多种分隔符的字符串 1.如何拆分含有多种分隔符的字符串 问题: 我们要把某个字符串依据分隔符号拆分不同的字段,该字符串包含多种不同的分隔符,例如: s = "ab;cd|efg|hi,jkl|mn\topq;rst,uvw\txyz" 其中;,|,\t 都是分隔符号,如何处理? 方法一: 连续使用str.split()方法,每次处理一种分隔符号 s = "ab;cd|efg|hi,jkl|mn\topq;rst,uvw\txyz&q

  • Scala解析Json字符串的实例详解

    Scala解析Json字符串的实例详解 1. 添加相应依赖 Json解析工具使用的 json-smart,曾经对比过Java的fastjson.gson.Scala的json4s.lift-json.其中 json-smart 解析速度是最快的. <dependency> <groupId>net.minidev</groupId> <artifactId>json-smart</artifactId> <version>2.3<

  • C++/C 回文字符串的实例详解

    C++/C 回文字符串的实例详解

    C++/C回文字符串的实例详解 判断输入的字符串是不是回文字符串,正反读一样. .C版 #include<stdio.h> int main() { char he[100]; char a; int i=0,flag=1; while((a=getchar())!='\n') { he[i]=a; i++; } int n=i; for(i=0;i<n/2;i++) { printf("%c\t%c\n",he[i],he[n-1-i]); if(he[i]!=he

  • jQ处理xml文件和xml字符串的方法(详解)

    1.xml文件 <?xml version="1.0" encoding="utf-8" ?> <root> <book id="1"> <name>锋利的jQuery1</name> <author>XXX1</author> <price>250</price> </book> <book id="2&quo

随机推荐