ES6 第四章字符串的新增方法

2023-12-26 17:07:03

前言

本章介绍字符串对象的新增方法。不常用的方法不做重点笔记。
本章原文链接：字符串的新增方法

includes()、startsWith()、endsWith()

确定一个字符串是否包含在另一个字符串中。ES6 又提供了三种新方法。

includes() 方法用于判断一个字符串是否包含在另一个字符串中
startsWith() 方法用来判断当前字符串是否以另外一个给定的子字符串开头
endsWith() 方法用来判断当前字符串是否是以另外一个给定的子字符串“结尾”的

方法名	返回值	描述	第二个参数： Num
includes()	布尔值	一个字符串是否包含参数字符串	从第 Num 个位置直到字符串结束
startsWith()	布尔值	一个字符串的开头是否包含参数字符串	从第 Num 个位置直到字符串结束
endsWith()	布尔值	一个字符串的结尾是否包含参数字符串	表示前 Num 个字符

let sampleString = 'Hello world!';

const sample1 = sampleString.includes('llo');
const sample2 = sampleString.startsWith('H');
const sample3 = sampleString.endsWith('d!');
console.log(sample1, sample2, sample3); // true true true

// 使用第二个参数
const sample11 = sampleString.includes('llo', 1);
const sample12 = sampleString.startsWith('H', 1);
const sample13 = sampleString.endsWith('d!', 10);
console.log(sample11, sample12, sample13); // true false false

repeat()

repeat()方法返回一个新字符串，表示将原字符串重复n次。
参数为小数就会向下取整，为负数和无穷(Infinity)则会报错.

参数	处理
小数	向下取整
字符串	先转换成数字
负数	报错
Infinity	报错

const SAMPLE = 'Ha';
let sample1 = SAMPLE.repeat(4); // 重复四次
console.log(sample1); // HaHaHaHa

let sample2 = SAMPLE.repeat(1.8); // 参数为小书，向下取整
console.log(sample2); // Ha

let sample3 = SAMPLE.repeat('3'); // 参数为字符串
console.log(sample3); // HaHaHa

let sample4 = SAMPLE.repeat(-4); // 参数为负数
console.log(sample4); // 直接报错 Invalid count value

padStart()，padEnd()

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

padStart()用于头部补全。
padEnd()用于尾部补全。

padStart()与padEnd()都接受两个参数

参数一：字符串补全生效的最大长度。如果当前字符串小于指定的长度，则进行补全。
参数二：用来补全的字符串。如果字符串长度过长，则会删除后面的多出的字符串。默认空格补全。

const SAMPLE = '368';

let newSample = SAMPLE.padStart(11, "000,");
let newSample1 = SAMPLE.padEnd(11, ",000");
console.log(newSample); // 000,000,368
console.log(newSample1); // 368,000,000

trimStart()，trimEnd()

ES2019 对字符串实例新增了trimStart()和trimEnd()这两个方法。去处字符串的空白符，它们的行为与trim()一致，空白符包括：空格、制表符 tab、换行符等其他空白符等。

trim() 消除字符串的头尾空白符。
trimStart()消除字符串头部的空白符，别名为：trimLeft();
trimEnd()消除字符串尾部的空白符。别名为：trimRight();
返回值为一个新字符串，表示除去空格的调用字符串。

const SAMPLE = '  Ha  ';
let newSample = SAMPLE.trimStart();
let newSample1 = SAMPLE.trimEnd();
console.log(newSample); // Ha  
console.log(newSample1); //   Ha

matchAll()

matchAll()方法返回一个包含所有匹配正则表达式的结果,返回的是一个迭代器(Iterator)。
这块不深入，后面正则表达式扩展再进行详解。

const string = 'sample1sample2sample3';
const regex = /sample/g;

for (const match of string.matchAll(regex)) {
  console.log(match);
}
// 遍历输出
/*
['sample', index: 0, input: 'sample1sample2sample3', groups: undefined]
['sample', index: 7, input: 'sample1sample2sample3', groups: undefined]
['sample', index: 14, input: 'sample1sample2sample3', groups: undefined]
*/

replaceAll()

简单来说，可以一次性替换所有匹配。

// 语法
String.prototype.replaceAll(searchValue, replacement);

replaceAll() 方法返回一个新字符串，新字符串所有满足 pattern 的部分都已被replacement 替换

两个参数

参数一：可以是一个字符串，也可以是一个全局的正则表达式（带有g修饰符）。
参数二：第二个参数replacement是一个字符串，表示替换的文本，其中可以使用一些特殊字符串。除了为字符串，也可以是一个函数，该函数的返回值将替换掉第一个参数searchValue匹配的文本。
- $&：匹配的字符串。
- $ `：匹配结果前面的文本。
- $'：匹配结果后面的文本。
- $n：匹配成功的第n组内容，n是从1开始的自然数。这个参数生效的前提是，第一个参数必须是正则表达式。
- $$：指代美元符号$。

const SAMPLE = 'HaHa，huhu，hehe';
let sample1 = SAMPLE.replaceAll('h', 'H');
let sample2 = SAMPLE.replaceAll('H', () => 'h');
console.log(sample1); // HaHa，HuHu，HeHe
console.log(sample2); // haha，huhu，hehe

String.raw()

ES6 还为原生的 String 对象，提供了一个raw()方法。是用来获取一个模板字符串的原始字符串的，在大多数情况下, String.raw()是用来处理模版字符串的。

console.log(`Hi\n${2+3}!`); // 
/*
输出
Hi
5!
*/
console.log( String.raw`Hi\n${2+3}!`); // 输出 Hi\n5!

String.fromCodePoint()

String.fromCodePoint() 静态方法返回使用指定的代码点序列创建的字符串。可以识别大于0xFFFF的字符，弥补了String.fromCharCode()方法的不足。

console.log(String.fromCodePoint(9731, 9733, 9842, 0x2F804));
// 直接输出 ☃★♲你

码农公寓

前言