[记录] JavaScript 中的字符串操作

字符串原型:
通过修改字符串的原型,可以为所有字符串添加公共方法

String.prototype.startwith = function(text) {
    return this.indexOf(text) == 0;
};
var str = 'ABC123你好!';
str.startwith('A'); // 调用原型方法


JS 中的字符串操作
字符串:基本数据类型,一旦定义就不会被修改,如果修改则是重新开辟空间存储。字符串有属性length和一系列方法。
字符串的生成转换 (可以将任何类型的数据转换为字符串)
转换成字符串的三种方式:

.toString() 方法
注: undefined、null没有toString()方法。  
var num = 28;
console.log(typeof num.toString());  // 返回结果是"string", 

String() 方法
注: undefiend、null可以通过String()转换为字符串

(A + "") 拼接字符串
注: 所有的类型都可以通过拼接字符串的形式转换成字符串

根据索引查找字符:
1. str.charAt(索引值); // 获取指定索引上的字符

var str = 'ABC123你好!';
console.log( str.charAt(1) ); // B
console.log( str.charAt(str.length-1) ); // !
console.log( str.charAt(1000) ); // '' 索引超出边界返回空

2. str[索引值] : str[0] 和数组一样,通过下标获取,H5新增,IE6-7-8不支持

var str = 'ABC123你好!';
console.log( str[1] ); // B
console.log( str[str.length-1] ); // !
console.log( str[10000] ); // 索引超出边界返回undefined

3. str.charCodeAt(索引值); // 获取指定索引上的Unicode编码

var str = 'ABC123你好!';
console.log( str.charCodeAt(1) ); // 66
console.log( str.charCodeAt(str.length-1) ); // 65281
console.log( str.charCodeAt(1000) ); // 索引超出边界返回NaN

根据字符查索引:
1. str.indexOf('字符串'); 从左往右查, 返回当前存在字符的位置

var str = 'ABC123你好!';
console.log( str.indexOf("C") ); // 2
console.log( str.indexOf("Ga") ); // 未找到匹配字符,返回 -1

2. str.lastIndexOf('字符串'); 从右往左查,返回当前存在字符的位置

var str = 'ABC123你好!';
console.log( str.lastIndexOf("C") ); // 2
console.log( str.lastIndexOf("Ga") ); // 未找到匹配字符,返回-1

字符串拼接:
1. 使用 +号 拼接字符串

var str = 'ABC123你好!';
str = str + '深圳'; // ABC123你好!深圳

2. concat() 方法可以拼接字符串,也能拼接数组

// 拼接字符串
str = str.concat('深圳'); // ABC123你好!深圳

// 拼接数组
[1,5,9].concat([6,2,8]); // [1,5,9,6,2,8]

字符串截取:
1. arrayObject.slice(开始索引值,结束索引值); // 由于字符串是个类数组,所以slice能截取数组和字符串; 不改变原数据,返回值是剪切的内容

var str = 'ABC123你好!';
// 没有参数时: 拷贝一份
console.log( str.slice() ); // 'ABC123你好!'
// 一个参数时: 从开始索引值截取到最后
console.log( str.slice(3) ); // '123你好!'
// 两个参数时: 包左不包右
console.log( str.slice(0,3) ); // 'ABC'
// 当参数为负数时: 从右往左数
console.log( str.slice(-2) ); // '好!'
// 前大后小 则返回空字符串
console.log( str.slice(3,0) ); // 返回 空字符串
总结:
a). 支持对数组和字符串的截取(不改变原数据,返回值为截取内容)
b). 支持负数,一个参数时,从开始索引值截取到最后
c). 两个参数时,包左不包右,如果前大后小,则返回空字符串或数组

2. str.substr(开始索引值,截取个数);

var str = 'ABC123你好!';
// 没有参数时: 拷贝一份
console.log( str.substr() ); // 'ABC123你好!'
// 一个参数时: 从开始索引值截取到最后
console.log( str.substr(3) ); // '123你好!'
// 两个参数时: 从开始索引值截取1个
console.log( str.substr(2,1) ); // 'C'
// 当参数为负数时: 从右往左数
console.log( str.substr(-2) ); // '好!'
总结:
a). 不改变原数据,返回值为截取的内容。
b). 支持负数,一个参数时,从开始索引值截取到最后
c). 两个参数时, 从开始位置, 截取指定长度的字符

3. str.substring(开始索引值,结束索引值);

var str = 'ABC123你好!';
// 没有参数时: 拷贝一份
console.log( str.substring() ); // 'ABC123你好!'
// 一个参数时: 从开始索引值截取到最后
console.log( str.substring(3) ); // '123你好!'
// 两个参数时: 包左不包右
console.log( str.substring(0,3) ); // 'ABC'
// 不支持负数,如果是负数则视为0
console.log( str.substring( -11, 3) ); // 'ABC'
// 前大后小,则智能调换位置
console.log( str.substring(6,3) ); // '123'
总结:
a). 不改变原数据,返回值为截取的内容。
b). 不支持负数,如果是负数则视为0
c). 两个参数时,包左不包右,如果前大后小,则智能调换位置。

字符串替换:
1. str.replace(regExp/substr, 替换的内容);

var str = "Today is a good day."
// 字符串的形式: 只能替换一个, 无法忽略大小写
cosnole.log( str.replace('Today', 'Tomorrow') );// "Tomorrow is a good day."
// 正则的形式: 可以替换多个,可以忽略大小写
console.log( str.replace(/today/ig, 'Tomorrow') ); 

// 传入函数时的用法
str.replace(regExp/substr, function(a, b, c){
    // 可以传3个参数
    // a: 为匹配的字符串
    // b: 为匹配字符串的起始位置
    // c: 为调用replace方法的字符串本身
});

字符串大小写转换:

var str = 'ABC123你好!';
str.toLowerCase();  // 英文字符转换成小写
var str = 'abc123你好!';
str.toUpperCase(); // 英文字符转化成大写 

字符串分割: split() 和 join() 是一对

str.split(分隔符[,分割长度]); // 用于把一个字符串分割成字符串数组
var str = 'aaa|bbb|ccc';
// 按'|'进行分割,参数不会出现在数组中;
console.log( str.split('|') ); // ["aaa","bbb","ccc"]
// 不带参数,整体作为一个元素
console.log( str.split() ); // ["aaa|bbb|ccc"]
// 按空字符串分割,则每个字符都为一个元素
console.log( str.split("") ); // ["a","a","a","|","b","b","b","|","c","c","c"]
// 指定长度分割
console.log( str.split("", 2) ); // ["a","a"]

字符串匹配:
1. str.search(regexp); // 匹配指定字符串, 返回起始位置,匹配不成功则返回 -1; 不执行全局匹配,匹配成功则不再匹配

var str = 'ABC123你好!';
str.search(/3/i); // 5
str.search(/D/i); // -1

2. str.match(substr/regexp); // 返回匹配结果的数组,匹配失败返回null

var str = 'A123B345ABC456";
// 在字符串内检索指定的值,或找到一个或多个匹配
console.log( str.match(/A/ig); // ["A","A"]
// 未找到匹配内容返回 null
console.log( str.match(/DDD/ig); // null

3. 正则方法: reg.test(str); // 返回 true 或 false

var str = 'ABC123你好!';
var reg = /ABC/ig;
console.log( reg.test(str) ); // true;
var reg = /DDD/ig;
cosnole.log( reg.test(str) ); // false;

4. 正则方法: reg.exec(str); 返回一个数组,存放匹配结果,未找到,返回null


字符串案例:
1. 统计一个字符串中出现次数最多的字符和次数。
例如: "Hollow word! good day!" => o, 5次

2. 获取URL中?后面的内容,并转化成对象的形式;
例如: "https://www.baidu.com/login?name=yuxi2018&password=123456&type=1" => { name: "yuxi2018", password: "123456", type: 1 }

3. 字符串去重
例如: "aabbcc123" => "abc123";

4. 生成驼峰法字符串
例如: border-bottom-color => borderBottomColor

原文地址:https://www.cnblogs.com/yuxi2018/p/9531311.html