Javascript字符串方法总结

疑问？

关于字符串的方法，繁多且参数不一，如果不进行一次完整的总结，很容易混淆用法或者遗漏API中有的方法，导致重复造轮子或者简单问题复杂化，所以接下来通过总结所有常用字符串方法，通过比对，功能的归纳来总结javascript中的字符串方法

步骤：

字符串方法总览

首先我们需要总览js中的常用字符串方法、

并且我已经将其分类，除了string本身，length这个属性，它的方法我分为了 访问，获取，查找，作用，

其中查找还有子字符串和正则匹配查找，通过有条理的分类不仅可以方便归纳总结，还便于记忆学习

String

首先我们可以通过声明字符串来了解字符串这个数据类型

let str1 = 'Hello String!';  // ' '
let str2 = "Hello String!";  // " "
let str3 = `Hello ${str1}!`;  // ` `

这三个变量都是字符串类型，我们可以看到，可以通过三种引号来声明字符串 ， 单引号，双引号，反引号

反引号是ES6新推出的声明方法，集合了众多优点，

0. 可以通过 ${...args} 将任意变量甚至表达式（函数）嵌入到字符串中
1. 允许字符串跨行
2. 反引号还可以指定一个模板函数，本文不展开

注意：字符串不可变更，所以所有的字符串方法都是通过返回修改完的字符串来完成‘修改’ 的

转义字符

字符	描述
\n	换行
\r	两个字符 \r\n 的组合代表一个换行。
', "	引号
\	反斜线
\t	制表符
\b, \f, \v	退格，换页，垂直标签--不常用

本文只列出常用的转义字符，不展开

let str = " 'Hello',I'm Cumin!" // 返回'Hello',I'm Cumin!

Length

Length 是 字符串的属性 使用时不要当成函数调用，表示的是字符串长度

let str = 'Hello\n';  // str.length == 6

转义字符当成转义后的字符

访问字符

【】

获取某个位置的字符，可以通过使用方括号直接获取

let str = "Hello";
// 第一个字符
alert( str[0] ); // H
​
// 最后一个字符
alert( str[str.length - 1 ] ); // o

注意：length返回的是数组的长度，而访问数组的下标计算是从0开始的，所以最后一位下标是 str.length - 1

CharAt() && CharCodeAt() && fromCharCode()

CharAt() 与 【】 作用完全一致，而CharCodeAt（） 可返回指定位置的字符的Unicode编码，使用较少

fromCharCode（）放在这有点牵强，它通过接收一个或多个Unicode值，然后返回一个字符串。

let str = "Hello";
// 第一个字符
alert( str[0] ); // H
alert(str.CharAt(0)) // H
​
console.log(str.charCodeAt(2))       //108
​
​
console.log(String.fromCharCode(97,98,99,100))           //abcd

CharAt() 与 【】 的 区别： 如果没有找到字符，【】返回 undefined ，charAt（） 返回一个空字符串

查找字符

字符串的查找有很多，但可以根据结果和参数的不同来分类得出使用场景和理解方法

返回参数查找

indexOf() && lastIndexOf()

indexOf()它从给定位置 开始，在 str 中查找 substr，如果没有找到，则返回 -1，否则返回匹配成功的位置。

str .indexOf(substr,pos)

注意：1.sunstr的检索大小写敏感 2.pos可选参数默认为0

let str = 'can you can a can as a caner can can a can';
​
let target = 'can'; // 这是我们要查找的目标
​
let pos = 0;
while (true) {
  let findPos = str.indexOf(target, pos);
  if (findPos == -1) break;
​
  alert( `Found at ${foundPos}` );
  pos = foundPos + 1; // 继续从下一个位置查找
}
​
// while((pos = str.indexOf(target, pos + 1)) != -1) { alert (...)} 可简写

lastIndexOf() 从末尾开始搜索到开头,处理与indexOf（）一致

返回布尔值查找

str.includes(substr,pos) 根据str从pos开始到结尾是否包含substr 来返回布尔值

使用场景：当我们只需要检测匹配，不需要清楚位置可以通过includes直接判断

alert( "Cumin Kasumi".includes("Cumin") ); // true
​
alert( "Cumin".includes("Hello") ); // false

另外的同类型查找还有 str.startWith() 和 str.endsWith() 有点像语法糖，功能如字面意思

alert( "Cumin Kasumi".startsWith("Cumin") ); // true，"Cumin Kasumi" 以 "Cumin" 开始
alert( "Cumin Kasumi".endsWith("Kasumi") ); // true，"Cumin Kasumi" 以 "Kasumi" 结束

正则相关查找

str.search(Regexp)

方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串。它会返回第一个匹配的子字符串的起始位置，如果没有匹配的，则返回-1。

    var str = "Hello,Cumin!"
    console.log(str.search("l"))           //2
    console.log(str.search("f"))           //-1
    console.log(str.search(/lo/))        //3

str.match(Regexp)

有三种情况

1.没有匹配到

返回null

let str = "Cumin";
​
let rs = str.match(/HTML/);
​
alert(rs); // null
alert(rs.length); // Error: Cannot read property 'length' of null

2.匹配到，正则没有全局匹配(或是子字符串)

则它以数组的形式返回一个匹配项，[' 匹配文本 ' ， index: index （匹配文本起始字符索引） ， input: 原字符串 ]

let str = "Cumin Kasumi";
​
let rs = str.match(/Cumin/);
​
alert( result[0] );     // Cumin（完全匹配）
alert( result.length ); // 1
​
// 其他信息：
alert( result.index );  // 0（匹配位置）
alert( result.input );  // Cumin Kasumi（源字符串）

3.匹配到，有全局匹配

则它将所有匹配项的数组作为字符串返回，而不包含其他详细信息。

let str = "Cumin Kasumi";
​
let result = str.match(/Cumin/g);
​
alert( result[0] ); // Cumin
alert( result.length ); // 1

获取子字符串

str.substr() && str.substring() && str.slice()

str.slice(start [, end])            从 start 到 end（不含 end）[start,end)            允许负值
str.substring(start [, end])        从 start 到 end（不含 end）[start,end)            负值视为0
str.substr(start [, length])        从 start 开始获取长为 length 的字符串               start可以为负数

substring: 返回一个开始索引到结束索引之间的一个子集

说明：
indexStart是一个0到字符串长度之间的整数。indexEnd是可选参数，同样是一个0到字符串长度之间的整数。
(1) 如果任意一个参数小于0或者为NaN,则被当作0
(2) 如果任意一个参数大于string.length,则当作string.length
(3) 如果 indexStart 大于 indexEnd，则 substring 的执行效果就像两个参数调换了一样。
(4) 如果 indexStart 等于 indexEnd，substring 返回一个空字符串。

slice: 提取一个字符串的一部分，并返回一个新的字符串

说明： 
beginSlice: 从该索引处开始提取原字符串中的字符，如果值是负数，
会用字符串的长度+beginSlice来处理。(比如参数是-2，则从倒数第二个取到字符串结尾)
endSlice:可选，在该索引处结束提取字符串，如果省略该参数，slice会一直提取到字符串末尾，
如果该参数是负数，则会用字符串的长度+endSlice来处理。（同理）

substr()方法可在字符串中抽取从start下标开始的指定数目的字符。

其返回值为一个字符串，包含从 stringObject的start（包括start所指的字符）处开始的length个字符。如果没有指定 length，那么返回的字符串包含从start到stringObject的结尾的字符。另外如果start为负数，则表示从字符串尾部开始算起。

三种获取子字符串的方法作用差别不大，但slice（） 使用方法更活，只需用好slice就可以掌握获取子字符串的方法，其他了解即可

作用字符串的函数

这一模块的方法作用不一，但很常用，分类记忆‘

toLowerCase() && toUpperCase()

str.toLower(Upper)Case() 字符串直接调用 ， 字符串中的所有的字母字符就会变为小写（大写）

    var str = "Hello,Cumin!"
    console.log(str.toLowerCase())        //hello,cumin!
    console.log(str.toUpperCase())        //HELLO,CUMIN!

replace() && trim()

replace()方法用来进行字符串替换操作，它可以接收两个参数，前者为被替换的子字符串（可以是正则表达式），后者为用来替换的文本或者一个每次匹配都要调用的函数。

如果第一个参数传入的是子字符串或是没有进行全局匹配的正则表达式，那么replace()方法将只进行一次替换（即替换最前面的），返回经过一次替换后的结果字符串。

str.replace(regexp|substr, newSubStr|function)
​
let str="hello Cumin";
let reg=/o/ig;
let str1=str.replace(reg,"**")
console.log(str1);  // hell** Cumin

• str.trim() —— 删除字符串前后的空格 (“trims”),可以当作语法糖用于处理表单字符串

repeat() && concat()

    // concat()  的源码
    public String concat(String str) {
        int otherLen = str.length();
        if (otherLen == 0) {
            return this;
        }
        int len = value.length;
        char buf[] = Arrays.copyOf(value, len + otherLen);
        str.getChars(buf, len);
        return new String(buf, true);
    }
​
"+"  //通过新建一个StringBuilder对象，通过append（）方法将字符拼接，之后调用toString（）转换为string类型
//两者没有作用上没有区别，实现原理不同，可以作为了解

repeat（）构造并返回一个新的字符串，该字符串包含连接在一起的指定数量的字符串的副本。

let resultString = str.repeat(count)
// count是介于0和js最大值之间的整数，表示在新构造的字符串中重复的次数

split()

split（）方法比较特殊，是通过分割符将字符串分割为一个数组

alert('12-34-56'.split('-')) // 数组 ['12', '34', '56']
// 同样适用正则表达式
alert('12, 34, 56'.split(/,\s*/)) // 数组 ['12', '34', '56']

这个常用于js类型转化：

总结。

首先我们要清楚string的特殊点，不可修改，所以string的所有方法都是返回一个新值，并且通过分类的记忆重新对string的方法有了归纳，便于以后使用场景可以快速反应，string的方法分为了：访问字符（通过索引），查找字符（通过值），获取子字符串，作用于字符串的函数，接下来就需要案例来进行新的理解