《深刻理解ES6》笔记——字符串和正则表达式（2）

相比较于第一章变量的声明，这一章的内容有了一点深度提高，但还不至于很难理解。本章主要讲2个知识点，字符串、正则表达式

字符串

字符串（String）是JavaScript6大原始数据类型。其余几个分别是Boolean、Null、Undefined、Number、Symbol（es6新增）。

字符串类型在前端开发者，是使用最频繁的类型之一，网站上可见的各类文案，几乎都是字符串类型的数据。咱们常常须要使用的操做无非是这么几点：读取字符串、转换字符串、清空字符串、拼接字符串、截取字符串。

在ES5中，字符串类型已经有了很是丰富的应用能力，那么，在ES6中，ECMA的专家们对字符串作了什么更新呢？

当Unicode引入扩展字符集以后，16位的字符已经不足以知足字符串的发展，因此才在ES6中更新了Unicode的支持。

咱们看看ES6字符串新增的方法

UTF-16码位：ES6强制使用UTF-16字符串编码。关于UTF-16的解释请自行百度了解。

codePointAt()：
该方法支持UTF-16，接受编码单元的位置而非字符串位置做为参数，返回与字符串中给定位置对应的码位，即一个整数值。

String.fromCodePoiont()：做用与codePointAt相反，检索字符串中某个字符的码位，也能够根据指定的码位生成一个字符。

normalize()：提供Unicode的标准形式，接受一个可选的字符串参数，指明应用某种Unicode标准形式。

正则表达式

正则表达式u修饰符：
当给正则表达式添加u字符时，它就从编码单元操做模式切换为字符模式。

其余新增的方法

上面提到的字符串和正则的新增方法只有在国际化的时候才用的到，我想，国内的不少网站仍是不须要考虑国际化的问题，看不懂就先丢掉。下面讲到的新增的方法是实际开发中需求比较频繁的方法。

字符串中的子串识别：

之前咱们常常使用indexOf()来检测字符串中是否包含另一段字符串。

let t = 'abcdefg'
if(t.indexOf('cde') > -1) {
  console.log(2)
}
//输出2，由于t字符串中包含cde字符串。

在ES6中，新增了3个新方法。每一个方法都接收2个参数，须要检测的子字符串，以及开始匹配的索引位置。

includes(str, index)：若是在字符串中检测到指定文本，返回true，不然false。

let t = 'abcdefg'
if(t.includes('cde')) {
  console.log(2)
}
//true

startsWith(str, index)：若是在字符串起始部分检测到指定文本，返回true，不然返回false。

let t = 'abcdefg'
if(t.startsWith('ab')) {
  console.log(2)
}
//true

endsWith(str, index)：若是在字符串的结束部分检测到指定文本，返回true，不然返回false。

let t = 'abcdefg'
if(t.endsWith('fg')) {
  console.log(2)
}
//true

若是你只是须要匹配字符串中是否包含某子字符串，那么推荐使用新增的方法，若是须要找到匹配字符串的位置，使用indexOf()。

repeat(number)

这个方法挺有意思的，接收一个Number类型的数据，返回一个重复N次的新字符串。即便这个字符串是空字符，也你能返回N个空字符的新字符串。

console.log('ba'.repeat(3)) //bababa

正则表达式的其余更新

正则表达式y修饰符、正则表达式的复制、flags属性......

因为这一块知识没用过，就不打算去研究实际用途。

模板字面量

之前，咱们用单引号或双引号表示字符串。

let a = '123' //单引号
let b = "123" //双引号

如今，使用模板字面量反撇号``。在实际开发中，这是常常都要用到的方法。

let c = `123` //反撇号

在字符串中使用反撇号，只须要加上转义符。

let d = `12\`3` //字符串内插入反撇号的方式。

在多行字符串的使用价值：

模板字面量为解决多行字符串的一系列问题提供了一个很是好的机制。

若是不使用模板字面量，实现多行字符串，你可能会使用换行符。

let a = '123\n456'
console.log(a) 
// 123
// 456

使用模板字面量，就能够很是简单的实现需求。

let a = `123
456
`
console.log(a)
// 123
// 456

在模板字面量插入变量的方法。

咱们再也不须要使用 +（加号）来向字符串插入变量，而是使用${params}直接插入你须要添加到字符串的位置。

let t = 'haha'
let a = `123${t}456`
console.log(a) //123haha456

这种方式也叫做字符串占位符。占位符支持互相嵌套模板字面量，强大吧。有了它，咱们终于能够抛弃 + 拼接字符串的恶心作法了。

模板字面量的终极用法
tag是一个方法，方法名你能够任意命名，这种写法被称做标签模板。

function tag(literals, ...substitutions) {
    //literals是数组，第一个位置是""，第二个位置是占位符之间的字符串，在本例中是haha
    //substitutions是字符串中的模板字面量，可能多个
    
    //函数最终返回字符串
}
let a = 4
let t = tag`${a} haha`
console.log(t) //4 haha

总结

本章讲到了ES6中新增的Unicode方法，可是对于不须要作国际化处理的同窗，这个功能就不会用到，须要关注的新增的字符串匹配的3个方法，以及模板字面量的使用。这2个知识点很是很是经常使用！

=> 返回文章目录