JS-String

2018-07-04 分类：JavaScript 作者：管理员阅读（451）

整理出字符串常用的一些方法:
字符串的截取
字符串的查找
字符串的拼接
字符串转数组
字符串的替换
字符串的相关

字符串的截取 - substr( ) | substring( ) | slice( )

定义和用法：
substr() 方法可在字符串中抽取从 start 下标开始的指定数目的字符
语法：str.substr(start,length)
start：
开始提取字符的位置。
如果为负值，则被看作 strLength + start，
其中 strLength 为字符串的长度（例如，如果 start 为 -3，则被看作 strLength + (-3)）
length：可选。提取的字符数。必须是数值。
如果省略了该参数，那么返回从 str 的开始位置到结尾的字串。

描述：
start 是一个字符的索引。首字符的索引为 0，最后一个字符的索引为字符串的长度减去1。
substr 从 start 位置开始提取字符，提取 length 个字符（或直到字符串的末尾）。
如果 start 为正值，且大于或等于字符串的长度，则 substr 返回一个空字符串。
如果 start 为负值，则 substr 把它作为从字符串末尾开始的一个字符索引。
如果 start 为负值且 abs(start) 大于字符串的长度，则 substr 使用 0 作为开始提取的索引。
如果 length 为 0 或负值，则 substr 返回一个空字符串。如果忽略 length，则 substr 提取字符，直到字符串末尾

1
2
3
4
5
6
7

var str = "abcdefghij";
console.log("(1,2): " + str.substr(1,2)); // (1,2): bc
console.log("(-3,2): " + str.substr(-3,2)); // (-3,2): hi
console.log("(-3): " + str.substr(-3)); // (-3): hij
console.log("(1): " + str.substr(1)); // (1): bcdefghij
console.log("(-20, 2): " + str.substr(-20,2)); // (-20, 2): ab
console.log("(20, 2): " + str.substr(20,2)); // (20, 2):

定义和用法：
substring() 方法返回一个字符串在开始索引到结束索引之间的一个子集, 或从开始索引直到字符串的末尾的一个子集
语法：
str.substring(indexStart,indexEnd)

indexStart：一个 0 到字符串长度之间的整数。

indexEnd：可选。一个 0 到字符串长度之间的整数。

返回值：包含给定字符串的指定部分的新字符串。

描述:
substring 提取从 indexStart 到 indexEnd（不包括）之间的字符，特别地：
如果 indexStart 等于 indexEnd，substring 返回一个空字符串。
如果省略 indexEnd，substring 提取字符一直到字符串末尾。
如果任一参数小于 0 或为 NaN，则被当作 0。
如果任一参数大于 stringName.length，则被当作 stringName.length。
如果 indexStart 大于 indexEnd，则 substring 的执行效果就像两个参数调换了一样。见下面的例子。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

var anyString = "Mozilla";

// 输出 "Moz"
console.log(anyString.substring(0,3));
console.log(anyString.substring(3,0));
console.log(anyString.substring(3,-3));
console.log(anyString.substring(3,NaN));
console.log(anyString.substring(-2,3));
console.log(anyString.substring(NaN,3));

// 输出 "lla"
console.log(anyString.substring(4,7));
console.log(anyString.substring(7,4));

// 输出 ""
console.log(anyString.substring(4,4));

// 输出 "Mozill"
console.log(anyString.substring(0,6));

// 输出 "Mozilla"
console.log(anyString.substring(0,7));
console.log(anyString.substring(0,10));

定义和用法：
slice() 方法提取一个字符串的一部分，并返回一新的字符串。
语法：
str.slice(beginSlice, endSlice)

beginSlice：
从该索引（以 0 为基数）处开始提取原字符串中的字符。
如果值为负数，会被当做 sourceLength + beginSlice 看待，
这里的sourceLength 是字符串的长度 (例如,如果beginSlice 是-3则看作是: sourceLength - 3)

endSlice：
可选。在该索引（以 0 为基数）处结束提取字符串。如果省略该参数，slice会一直提取到字符串末尾。
如果该参数为负数，则被看作是 sourceLength + endSlice，
这里的 sourceLength 就是字符串的长度(例如，如果 endSlice 是 -3，则是, sourceLength - 3)。

返回值：返回一个从原字符串中提取出来的新字符串

描述:
slice() 从一个字符串中提取字符串并返回新字符串。在一个字符串中的改变不会影响另一个字符串。
也就是说，slice 不修改原字符串，只会返回一个包含了原字符串中部分字符的新字符串
注意：slice() 提取的新字符串包括beginSlice但不包括 endSlice。[/cc]

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

var str1 = 'The morning is upon us.';
var str2 = str1.slice(4, -2);
console.log(str2); // OUTPUT: morning is upon u
str.slice(-3); // returns 'us.'
str.slice(-3, -1); // returns 'us'
str.slice(0, -1); // returns 'The morning is upon us'</p>

字符串的查找

<p class='con_info'>索引找字符
概述:
charAt() 方法从一个字符串中返回指定的字符。
语法:
str.charAt(index)
index:
一个介于0 和字符串长度减1之间的整数,(0~length-1)如果没有提供索引，charAt() 将使用0。
描述:
字符串中的字符从左向右索引，第一个字符的索引值为 0，
最后一个字符（假设该字符位于字符串 stringName 中）的索引值为 stringName.length - 1。
如果指定的 index 值超出了该范围，则返回一个空字符串。</p>

[cc lang='php']var str = "Brave new world";
console.log(str.charAt());//'B'
console.log(str.charAt(0));//'B'
console.log(str.charAt(1));//'r'
console.log(str.charAt(2));//a
console.log(str.charAt(3));//'v'
console.log(str.charAt(4));//'e'
console.log(str.charAt(999));//''

字符找索引

概述:
indexOf()方法返回调用 String 对象中第一次出现的指定值的索引，开始在 fromIndex进行搜索。
如果未找到该值，则返回-1。

语法:
str.indexOf(searchValue,fromIndex)

searchValue：
一个字符串表示被查找的值。

fromIndex:可选;表示调用该方法的字符串中开始查找的位置。可以是任意整数。默认值为 0

返回值:指定值的第一次出现的索引; 如果没有找到 -1。

描述:
字符串中的字符被从左向右索引。
首字符的索引（index）为 0，字符串 stringName 的最后一个字符的索引是 stringName.length - 1。
如果 fromIndex < 0 则查找整个字符串（如同传进了 0）。
如果 fromIndex >= str.length，则该方法返回 -1，除非被查找的字符串是一个空字符串，
此时返回 str.length。

1
2
3
4
5
6
7
8
9

var str ="Blue Whale";
console.log(str.indexOf("Blue")); // 0
console.log(str.indexOf("Blute")); // -1
console.log(str.indexOf("Whale", 0)); // 5
console.log(str.indexOf("Whale", 5)); // 5
console.log(str.indexOf("", 9)); // 9
console.log(str.indexOf("", 10)); // 10
console.log(str.indexOf("", 11)); // 10
//lastIndexOf()从该字符串的后面向前查找，从 fromIndex 处开始。

字符串的拼接

字符串的拼接性能：优先使用 + += 拼接字符串
概述:concat() 方法将一个或多个字符串与原字符串连接合并，形成一个新的字符串并返回。
语法:str.concat(string2, string3, ..., stringN)
string2...stringN:和原字符串连接的多个字符串
描述:
concat 方法将一个或多个字符串与原字符串连接合并，形成一个新的字符串并返回。 concat 方法并不影响原字符串。

var str ="ab";
var str1 ="cd";
console.log(str.concat(str1)); // abcd
[/cc]

字符串转数组

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

概述:
split() 方法使用指定的分隔符字符串将一个String对象分割成字符串数组,
以将字符串分隔为子字符串,以确定每个拆分的位置

语法:str.split(separator,limit)

separator:
指定表示每个拆分应发生的点的字符串。separator 可以是一个字符串或正则表达式。
如果纯文本分隔符包含多个字符，则必须找到整个字符串来表示分割点。
如果在str中省略或不出现分隔符，则返回的数组包含一个由整个字符串组成的元素。
如果分隔符为空字符串，则将str原字符串中每个字符的数组形式返回。

limit：
一个整数，限定返回的分割片段数量。
当提供此参数时，split 方法会在指定分隔符的每次出现时分割该字符串，但在限制条目已放入数组时停止。
如果在达到指定限制之前达到字符串的末尾，它可能仍然包含少于限制的条目。新数组中不返回剩下的文本。

返回值:返回源字符串以分隔符出现位置分隔而成的一个 Array

描述:
找到分隔符后，将其从字符串中删除，并将子字符串的数组返回。
如果没有找到或者省略了分隔符，则该数组包含一个由整个字符串组成的元素。
如果分隔符为空字符串，则将str转换为字符数组。
如果分隔符出现在字符串的开始或结尾，或两者都分开，分别以空字符串开头，结尾或两者开始和结束。
因此，如果字符串仅由一个分隔符实例组成，则该数组由两个空字符串组成。</p>

[cc lang='php']
var str ="abcdefg";
console.log(str.split()); // ["abcdefg"]
console.log(str.split('')); // "a", "b", "c", "d", "e", "f", "g"]
console.log(str.split('d')); // ["abc", "efg"]
console.log(str.split('d',1)); // ["abc"]

字符串的倒置

1
2
3

var str ="abcdefg";
var reverseStr=str.split('').reverse().join('');
console.log(reverseStr)//gfedcba

字符串的替换

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34

概述:

replace（）方法返回一个由替换值替换一些或所有匹配的模式后的新字符串。
模式可以是一个字符串或者一个正则表达式, 替换值可以是一个字符串或者一个每次匹配都要调用的函数。

语法:str.replace(regexp|substr, newSubStr|function)

regexp (pattern):
一个RegExp 对象或者其字面量。该正则所匹配的内容会被第二个参数的返回值替换掉。

substr (pattern)：
一个要被 newSubStr 替换的字符串。其被视为一整个字符串，而不是一个正则表达式。仅仅是第一个匹配会被替换。

newSubStr (replacement):
用于替换掉第一个参数在原字符串中的匹配部分的字符串。该字符串中可以内插一些特殊的变量名。
参考使用字符串作为参数。

function (replacement):
一个用来创建新子字符串的函数，该函数的返回值将替换掉第一个参数匹配到的结果。
参考指定一个函数作为参数。

返回值:一个部分或全部匹配由替代模式所取代的新的字符串。

描述:
该方法并不改变调用它的字符串本身，而只是返回一个新的替换后的字符串。
在进行全局的搜索替换时，正则表达式需包含 g 标志。

使用字符串作为参数，替换字符串可以插入下面的特殊变量名：
变量名代表的值
$$ 插入一个 "$"。
$& 插入匹配的子串。
$` 插入当前匹配的子串左边的内容。
$' 插入当前匹配的子串右边的内容。
$n 假如第一个参数是 RegExp对象，并且 n 是个小于100的非负整数，那么插入第 n 个括号匹配的字符串。

1
2
3
4

//一般用法
var str='ABCDAFG';
var newstr=str.replace('A','|')
console.log(newstr)//|BCDAFG 只能替换掉第一个后面的无法替换

1
2
3
4

//全局匹配替换
var str='ABCDAFGa';
var newstr=str.replace(/A/gi,'|')
console.log(newstr)// |BCD|FG| 全局替换

1
2
3
4
5

//交换位置
var re = /(\w+)\s(\w+)\s(\w+)/;
var str = "John and Smith";
var newstr = str.replace(re, "$3, $2, $1");
console.log(newstr);// Smith, and, John

1
2
3
4
5
6
7
8
9
10
11

/*字符串替换-其他方法
替换掉字符串里所有指定的字符串:
swtichParse('abc=def=hjk','||') => 'abc||def||hjk'
*/
var str='abc=def=hjk'; //字符串
var replaceStrting='=';//被替换字符串
var targetString='||';//代替的字符串
function swtichParse(str,replaceStrting,targetString){
return str.split(replaceStrting).join(targetString)
}
console.log(swtichParse(str,replaceStrting,targetString)) //abc||def||hjk

字符出现的次数统计

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

var str = 'To be, or not to be, that is the question.';
function totalCount(str){
var count = 0;
var pos = str.indexOf('e');
while (pos !== -1) {
count++;
pos = str.indexOf('e', pos + 1);
}
return count
}
function totalCount1(str,searchStr){
return str.split(searchStr).length-1
}
console.log(totalCount(str)); // 4
console.log(totalCount1(str,'e')); // 4 这种方法更加简单博主无意琢磨出来的嘿嘿可以随意指定字符

获取字符串某个字符串的所有索引值集合

1
2
3
4
5
6
7
8
9
10
11
12

//getIndexArr(str,'a') = > [0, 7, 11, 16, 20]
var str = 'To be, or not to be, that is the question.';
function getIndexArr(str,targetStr){
var indexArr=[];
for(var i=0;i<str.length;i++){
if(str[i]===targetStr){
indexArr.push(i);
}
}
return indexArr;
}
console.log(getIndexArr(str,'e')); // [4, 18, 31, 35]

字符串转换成驼峰式写法

1
2
3
4
5
6
7

var str = "border-left-color";
function swtichHump(str){
return str.replace(/-(\w)/g,function(match,r1){
return r1.toUpperCase()
})
}
console.log(swtichHump(str))//borderLeftColor

1
2
3
4
5
6
7
8

function swtichHump(str){
var arr=str.split('-');
for(var i=1;i<arr.length;i++){
arr[i]=arr[i].charAt(0).toUpperCase()+arr[i].substr(1)
}
return arr.join('')
}
console.log(swtichHump(str))//borderLeftColor

查找字符串中出现最多的字符和个数

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

//查找字符串中出现最多的字符和个数
var str =" fdadffddfdffj";
function more(str){
var obj={},max=0,maxStr;
for(var i=0;i<str.length;i++){
if(!obj[str[i]]){
obj[str[i]]=1
}else{
obj[str[i]]+=1
}
}
for(var k in obj){
if(obj[k]>max){
max=obj[k];
maxStr=k
}
}
return {maxStr:maxStr,maxNum:max}
}
console.log(more(str))//{maxStr: "f", maxNum: 6}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

var str ="fdadffddfdffj";
function more(str){
var newArr=str.split('').sort().join(''),max=0,maxStr;
newArr.replace(/(\w)\1+/g,function(match,r1){
if(match.length>max){
max=match.length
maxStr=r1
}
})
return {maxStr: maxStr, maxNum: max}
}
console.log(more(str))//{maxStr: "f", maxNum: 6}
// /(\w)\1+/g:在这个例子里表示匹配到子串并且子串长度大于1
// 成功匹配的match:ddddd ffffff 而a只有一个不满足故没有上榜
// r1是子串里的字母 d f

1
2
3
4
5
6
7
8
9
10

var str = 'aaaaabbbaccdddddddd'
function more(str){
let arr =[...new Set(str.split(''))];
let a =[]
for(let i=0;i<arr.length;i++){
a.push(str.split(arr[i]).length-1)
}
return {maxStr: arr[a.indexOf(Math.max(...a))], maxNum: Math.max(...a)}
}
console.log(more(str));

如何给字符串加千分符

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

//此种方法博主无意琢磨出来的嘿嘿觉得思路更加清晰
var str = '123235549949945';//235,549,949,945
function thousands(str){
var len=str.length;
if(len<3)return str;
//是否刚好被3除尽
var isDiv=len%3==0
//可以几等分
var iNum=parseInt(len/3)
//不能均等分时前面的位数可能是1位或2位
var frontNum=len%3
var arr=[];
if(isDiv){//刚好被3除尽
for(var i=0;i<len;i++){
if(i%3==0){
arr.push(str.slice(i,i+3))
}
}
return arr.join(',')
}else{//被3除不尽
var firstStr=str.substr(0,frontNum)
var secoundStr=str.substr(frontNum)
for(var i=0;i<secoundStr.length;i++){
if(i%3==0){
arr.push(secoundStr.slice(i,i+3))
}
}
return firstStr+','+arr.join(',')
}
}
console.log(thousands(str));

1
2
3
4
5
6

var str = '235549949945';
function test(str){
var reg =/(?=(?!\b)(\d{3})+$)/g;
return str.replace(reg,',')
}
console.log(test(str));

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

var str = '35549949945';
function test(str){
var iNum = str.length%3;
var prev = '';
var arr=[];
var tmp ='';
var iNow =0;
if(iNum !=0){
prev = str.substring(0,iNum);
arr.push(prev);
}
str = str.substring(iNum);
for(var i=0;i<str.length;i++){
iNow++;
tmp +=str[i];
if(iNow ==3&&tmp){
arr.push(tmp);
tmp='';
iNow=0;
}
}
return arr.join(',');
}
console.log(test(str));

平分字符串

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

/*
deuceStr(str,n)方法：n个字符一组为一等份，分到最后不足n的，自动单独为一等份
超出或等于字符串长度的整个字符串为一组作为一个等份
*/
var str = '1234567891';
var str1 = '来自散人笔记的一个方法';
function deuceStr(str,n){
var len=str.length,arr=[];
for(var i=0;i<str.length;i++){
if(i%n==0){
arr.push(str.slice(i,i+n))
}
}
return arr
}
console.log(deuceStr(str,3));//["123", "456", "789", "1"]
console.log(deuceStr(str1,3));//["来自散", "人笔记", "的一个", "方法"]

寻找所有子串的位置

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

var str = '1234567891';

function substrPosition (str, substr) {
/*
find all the substr position
*/
var position_arr = [];
var index = str.indexOf(substr);
while(index != -1) {
position_arr.push(index);
index = str.indexOf(substr, index+1);
}
return position_arr;
}
console.log(substrPosition (str, '1'))//[0, 9]

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

var str = '1234567891';

function substrPosition (str, substr) {
/*
find all the substr position
*/
var position_arr = [];
for(var i=0;i<str.length;i++){
if(str[i]===substr){
position_arr.push(i)
}
}
return position_arr;
}
console.log(substrPosition (str, '1'))//[0, 9]

解析url参数

1
2
3
4
5
6
7
8
9
10

var url= 'http://moxiaofei.com/a.php?a=1&b=2&c=3&d=xxx'
function parseUrl(url){
var paramPartStr=url.split('?')[1];//a=1&b=2&c=&d=xxx'
var result={}
paramPartStr.replace(/(\w)=(\w)&?/g,function(r1){
result[r1.split('=')[0]]=r1.split('=')[1].replace('&','')
})
return result
}
console.log(parseUrl(url))//{a: "1", b: "2", c: "3", d: "x"}

根据一个字符串每个字符的出现次数从大到小排序

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>demo</title>
</head>
<body>
<input type="text" id="ipt">
<p>根据字符串中每个字符出现的次数从大到小的一个排名</p>
<p id="view"></p>
<ul id="show"></ul>
</body>
<script>
var ipt=document.querySelector('#ipt');
var view=document.querySelector('#view');
var show=document.querySelector('#show');
ipt.oninput=function(){
view.innerHTML=sortResult(this.value).str
var obj=sortResult(this.value).obj;
var html='';
for(var k in obj){
html+=`<li>${k}出现次数为:${obj[k]}</li>`
}
show.innerHTML=html
}
//排序方法
function sortResult(str){
if(str.length===0){return false}
var obj={}
var head=[]
for(var i=0;i<str.length;i++){
if(!obj[str[i]]){
obj[str[i]]=1
}else{
obj[str[i]]++
}
}
var _obj=deepCopy(obj);
max(obj);
function max(obj){
var n=0;
var newStr='';
for(var key in obj){
if(obj[key]>n){
n=obj[key];
newStr=key;
}
}
if(newStr==''){
head=head;
return false;
}
head.push(newStr);
delete obj[newStr];
max(obj);
}
return {str:head.join(''),obj:_obj}
}
//深度拷贝
function deepCopy(p,c){
var c = c || {};
for (var i in p) {
if (typeof p[i] === 'object') {
c[i] = (p[i].constructor === Array) ? [] : {};
deepCopy(p[i], c[i]);
} else {
c[i] = p[i];
}
}
return c;
}
</script>
</html>

1
2
3
4
5
6

需求描述:
var str='sadfddfsgffsdssssddddddf';//一个字符串
根据目测:字符串里有5种类别分别是:s a d f g
根据目测:s a d f g在str中出现的次数分别是:s:7 a:1 d:10 f:5 g:1
请写个方法返回按次数大小排序的字符串:
sortByCountDdisplay(str)返回 'dsfag'

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

var str='sadfddfsgffsdssssddddddf';

function sortByCountDdisplay(str){
var arr=[]
var obj={}
for(var i=0;i<str.length;i++){
if(!obj[str[i]]){
obj[str[i]]=1
}else{
obj[str[i]]++
}
}
getMax(obj)
function getMax(obj){
var max=0;
var maxValue=null;
for(var k in obj){
if(obj[k]>max){
max=obj[k]
maxValue=k
}
}
if(maxValue==null){
return arr
}
arr.push(maxValue)
delete obj[maxValue]
getMax(obj)
}
return arr.join('')
}
console.log(sortByCountDdisplay(str))//dsfag

「两年博客，如果觉得我的文章对您有用，请帮助本站成长」

赞(1) 打赏