js字符串方法大全

面向Web3，春暖花开

于 2019-10-24 14:38:43 发布

阅读量1k

点赞数 3

分类专栏： JS 前端文章标签：字符串方法

本文链接：https://blog.csdn.net/weixin_29491885/article/details/102723027

版权

前端同时被 2 个专栏收录

73 篇文章 1 订阅

订阅专栏

41 篇文章 0 订阅

订阅专栏

string对象构造函数

// 传统方式 - 背后会自动将其转换成对象
// 所以我们才可以访问string对象中方法
var qianduan ='前端'
//通过对象形式
var pYthon = new String('大前端')
console.log(qianduan)
console.log(pYthon)
//使用对象中的方法
console.log(qianduan.charAt(0))
console.log(qianduan.concat(['php','java']))

concat方法连接字符串

var s1="a";
var s2="b";
var s3="c";
console.log(s1.concat(s2,s3));//abc
// 等同于：result = s1 + s2 + ... + s
// 关联记忆：数组中的concat
var arr = [1, 2, 3];
console.log(arr.concat(4, 5));//[1,2,3,4,5]

indexOf 获取索引值

找到匹配项返回索引值，如果没找到返回-1

var myString="JavaScript";
var a1=myString.indexOf("v");//2
var a2=myString.indexOf("S");//4
var a3=myString.indexOf("Script");//4
var a4=myString.indexOf("key");// 如果没有匹配项返回 -1
console.log(a1)//2
console.log(a2)//4
console.log(a3)//4
console.log(a4)//-1
// 完整的indexof用法：
// 可以传入第二个参数：indexOf（str，fromIndex）
// 表示从索引位置fromIndex开始查找，如果fromIndex省略，则表示默认从起始索引0开始查找；
// 若fromIndex为负，则从索引0开始查找。
var b1 = myString.indexOf("v",5); // 从下标5开始查找，而v在索引2，所以找不到，返回-1
var b2 = myString.indexOf("v",1); //-2
console.log(b1);//-1
console.log(b2);//-2

startsWith endsWith includes

返回布尔值

let s='hello world';
s.startsWith('h');//true
s.endsWith('d');//true
s.includes('w');//true

charAt charCodeAt codePointA fromCharCode

charAt: 返回指定索引位置的字符,因为Javascript中没有字符类型，所以返回的是长度为1的字符串
fromCodePoint 返回指定索引位置的字符，若索引越界，返回空字符串。

myString="JavaScript";
console.log(myString.charAt(1));//a
console.log(myString.charAt(10000000000000000));//若索引越界，返回空字符串
console.log(myString.charAt(-1));//若索引越界，返回空字符串  -- ""
console.log(myString.charAt(-10000000000000000000000));//若索引越界，返回空字符串

var s = "?";
s.charAt(0) // ''
s.charAt(1) // ''
s.charCodeAt(0) // 55362
s.charCodeAt(1) // 57271
s.codePointAt(0) // 134071
s.codePointAt(1) // 57271
//从 Unicode 码点返回对应字符
String.fromCharCode(0x20BB7)// “ஷ"，不能识别大于0xFFFF的码点
String.fromCodePoint(0x20BB7);// “?"，在作用上，正好与codePointAt方法相反

substr(fromIndex,length)

获取部分字符串从起始索引fromIndex开始截取长度length的字符串

// 正向截取
myString="JavaScript";
console.log(myString.substr(1,1));//a          表示从第1个索引值开始截取，截取1个字符
console.log(myString.substr(1,2));//av         表示从第1个索引值开始截取，截取2个字符
console.log(myString.substr(1,3));//ava        表示从第1个索引值开始截取，截取3个字符
console.log(myString.substr(1,4));//avaS       表示从第1个索引值开始截取，截取4个字符
// 若不指定length或者length超过可截取的最大长度，则截取到结尾。
console.log(myString.substr(1));//avaScript
console.log(myString.substr(1,4000000));//avaScript

// 反向截取
// 若起始索引为负，则从右往左开始截取 - -1表示倒数第一个， -2表示倒数第二个
myString="JavaScript";
console.log(myString.substr(-1,1));//t  表示从倒数第一个开始截取，截取1个字符
console.log(myString.substr(-2,1));//p  表示从倒数第二个开始截取，截取1个字符
console.log(myString.substr(-3,1));//i  表示从倒数第三个开始截取，截取1个字符
console.log(myString.substr(-4,1));//r  表示从倒数第四个开始截取，截取1个字符
console.log(myString.substr(-5,1));//c  表示从倒数第五个开始截取，截取1个字符
console.log(myString.substr(-6,1));//S  表示从倒数第六个开始截取，截取1个字符
console.log(myString.substr(-7,1));//a  表示从倒数第七个开始截取，截取1个字符
myString="JavaScript";
console.log(myString.substr(-6,1));//S  表示从倒数第6个开始截取，截取1个字符
console.log(myString.substr(-6,2));//Sc  表示从倒数第6个开始截取，截取2个字符
console.log(myString.substr(-6,3));//Scr  表示从倒数第6个开始截取，截取3个字符
console.log(myString.substr(-6,4));//Scri  表示从倒数第6个开始截取，截取4个字符
console.log(myString.substr(-6,5));//Scrip  表示从倒数第6个开始截取，截取5个字符
console.log(myString.substr(-6,6));//Script  表示从倒数第6个开始截取，截取6个字符

// 从倒数的方式开始截取，获取av
myString="JavaScript";
console.log(myString.substr(-9,2));//Script  表示从倒数第6个开始截取，截取6个字符

// 整数的方式获取大写S
// 获取几个字符，则后面的参数就确定了
myString="JavaScript";
console.log(myString.substr(4,1));//S  表示从索引值4开始截取，截取1个字符
console.log(myString.substr(-6,1));//S  表示从倒数第6个开始截取，截取1个字符

substring(startIndex,endIndex)

获取部分字符串
截取起始索引startIndex 到结束索引endIndex的子字符串
结果包含startIndex处的字符，不包含endIndex处的字符。

// 获取 av
myString="JavaScript";
console.log(myString.substring(1,3));
// 获取 大写的 S
myString="JavaScript";
console.log(myString.substring(4,5));
// 其他小点：
// 如果省略个数,则自动获取后面所有
  console.log(myString.substring(4));//Script
// 若startIndex或者endIndex为负，则会被替换为0。
console.log(myString.substring(-1,1));//J
// 若startIndex = endIndex，则返回空字符串。
console.log(myString.substring(3,3));//返回空
// 若startIndex > endIndex，则执行方法时，两个值会被交换。
console.log(myString.substring(3,1));//等价于myString.substring(1,3)

slice(startIndex,endIndex)

获取部分字符串
截取起始索引startIndex 到结束索引endIndex的子字符串
结果包含startIndex处的字符，不包含endIndex处的字符。

myString="JavaScript";
console.log(myString.slice(1,3)) //av
console.log(myString.slice(4,5)) //S
console.log(myString.slice(4)) //Script  //如果省略个数,则自动获取后面所有
// 基本用法和substring用法一样，不同点如下：
// stringObj.slice(start, [end])
// 如果 start 为负，将它作为 length + start处理，此处 length 为数组的长度。
    console.log(myString.slice(-1,3))
// 如果 end 为负，就将它作为 length + end 处理，此处 length 为数组的长度。
    console.log(myString.slice(2,-3))
// 如果省略 end ，那么 slice 方法将一直复制到 arrayObj 的结尾。
// 如果 end 大于 start，不复制任何元素到新数组中。
// strVariable.substring(start, end)
// 如果 start 或 end 为 NaN 或者负数，那么将其替换为0。
// 子字符串的长度等于 start 和 end 之差的绝对值。例如，在 strvar.substring(0, 3) 和 strvar.substring(3, 0) 返回的子字符串的的长度是 3。
// slice可以对数组操作，substring不行。。。

split()分割

按给定字符串分割，返回分割后的多个字符串组成的字符串数组。

var s="a,bc,d";
console.log(s.split(","));//["a", "bc", "d"]
s="a1b1c1d1";
console.log(s.split("1"));//["a", "b", "c", "d", ""]

join()合并

使用您选择的分隔符将一个数组合并为一个字符串

var myList=new Array("jpg","bmp","gif","ico","png");
var imgString=myList.join("|");//结果是jpg|bmp|gif|ico|png
console.log(imgString)
// split()还可以结合正则表达式
myString = 'javascript is a good script language';
console.log(myString.split(/\s/)); //javascript,is,a,good,script,language
// 传入\s表示要匹配空格，我们将字符串分割为一个数组，如果你要访问某一个，那么可以明确指出：
console.log(myString.split(/\s/)[3]); //good

字符串大小写转换

使用您选择的分隔符将一个数组合并为一个字符串

myString="JavaScript";
myString = myString.toLowerCase();//javascript
console.log(myString)
myString = myString.toUpperCase();//JAVASCRIPT
console.log(myString)

replace

用法1 - 基础用法

最核心的易错点：如果要替换全部匹配项，需要传入一个 RegExp 对象并指定其 global 属性。

// 基本用法：
myString = "javascript is a good script language";
// 在此我想将字母a替换成字母A
console.log(myString.replace("a","A"));
// 看到结果，它只替换了找到的第一个字符，如果想替换多个字符怎么办？
// 答案：结合正则表达式，这也是replace的核心用法之一！

// 将字母a替换成字母A 错误的写法  少了/g
myString = "javascript is a good script language";
console.log(myString.replace(/a/,"A"));
// console.log(myString.replace(new RegExp('a','gm'),"A"));
//将字母a替换成字母A  正确的写法 /g表示匹配所有
myString = "javascript is a good script language";
console.log(myString.replace(/a/g,"A"));

replace 特殊标记$

特殊标记$
对于正则replace约定了一个特殊标记符 $： 1 .$ i (i:1-99) : 表示从左到右正则子表达式所匹配的文本。
2. $KaTeX parse error: Expected 'EOF', got '&' at position 1: &̲:表示与正则表达式匹配的全文本\dots$ (:切换技能键)：表示匹配字符串的左边文本。
4. $^{'} (^{'} : 单引号) ：表示匹配字符串的右边文本。 5 .$ $：表示$ 转移。

//案例1- replace功能1 - 匹配后替换
//在本例中，我们将把所有的花引号替换为直引号：
myString = '"a", "b"';
//寻找所有的"abb"形式字符串，此时组合表示字符串，，然后用'$1'替换
myString = myString.replace(/"([^"]*)"/g, "'$1'");
console.log(myString)

// 案例2- replace功能1 - 匹配后替换
myString= "javascript is a good script language";
console.log(myString.replace(/(javascript)\s*(is)/g,"$1 $2 fun. it $2"));

// 案例3 - replace功能2 - 分组匹配后颠倒
// 在本例中，我们将把 "itcast,cn" 转换为 "cn itcast" 的形式：
myString = "itcast , cn";
myString = myString.replace(/(\w+)\s*, \s*(\w+)/, "$2 $1");
console.log(myString)

// 案例4 - replace功能2 - 分组匹配后颠倒
myString = "boy & girl";
myString.replace(/(\w+)\s*&\s*(\w+)/g,"$2 & $1") //girl & boy
console.log(myString)

// $&:表示与正则表达式匹配的全文本。
myString = "boy";
myString.replace(/\w+/g,"$&-$&") // boy-boy
console.log(myString)
// $`(`:切换技能键)：表示匹配字符串的左边文本。
myString = "javascript";
myString.replace(/script/,"$& != $`") //javascript != java
console.log(myString)
// $'(':单引号)：表示匹配字符串的右边文本。
myString = "javascript";
myString.replace(/java/,"$&$' is ") // javascript is script
console.log(myString)

replace 第二个参数可以是函数 - 最常用必考点

// 无敌的函数 - replace第二个参数可以传递函数
// 如果第二参数是一个函数的话，那么函数的参数是什么呢？
myString = "bbabc";
myString.replace(/(a)(b)/g, function(){
    console.log(arguments) // ["ab", "a", "b", 2, "bbabc"]
});
//  参数将依次为：
//  1、整个正则表达式匹配的字符。
//  2、第一分组匹配的内容、第二分组匹配的内容…… 以此类推直到最后一个分组。
//  3、此次匹配在源自符串中的下标（位置）。
//  4、源自符串
//  所以例子的输出是 ["ab", "a", "b", 2, "bbabc"]

// 用法举例  首字母大写 -- 一个参数 表示匹配的整个字符串
// 在本例中，我们将把字符串中所有单词的首字母都转换为大写：
myString = 'aaa bbb ccc';
myString=myString.replace(/\b\w+\b/g, function(word){
            return word.substring(0,1).toUpperCase()+word.substring(1);}
);
console.log(myString)

// 用法举例  首字母大写 -- 多个参数 - 第一个表示匹配的整个字符串，后面的表示分组中的内容
function capitalize(str){
    return str.replace( /(^|\s)([a-z])/g , function(m,p1,p2){ return p1+p2.toUpperCase();
    } );
};
myString = "i am a boy !"
console.log(capitalize(myString)) //I Am A Boy！

正则表达式

基础知识

星号(*) : 星号代表匹配它前面一个字符任意遍(0或任意次)
加号(+) : 加号是一个与星号(*)类似的通配符，它也是数量词，表示匹配前面的字符一次或多次（至少一次).
* 它与星号的差别就在这里，星号可以匹配0次，加号则必须一次以上。
问号(?) : 问号也是一个数量词，它代表匹配前一个字符0或1次。
中括号[] : 中括号用来表示一个字符集合，
* 如果这个集合有很多元素，如26个字母，数字等，一个个地写在中括号里，未免太麻烦太蠢笨，
* 这时可以用连字符(hyphen)来表示一个范围，
* 如:[a-z]表示小写字母的集合，
* [a-zA-Z]表示大小写字母的集合。
* 脱字符^ (caret).
* 这种写法表示，匹配任何不在该集合中的字符，与上面的用法刚好相反

特殊字符：

\w : (小写w) 表示字母或数字，等价于 [a-zA-Z0-9]
\W : (大写W)非字母且非数字，与\w相反等价于 ‘[^A-Za-z0-9_]’
\s : (小写s)匹配一个空格字符，包括：空格，换行，回车,tab,等价于[ \n\r\t\f]
\S : (大写S)匹配非空格字符，\s的相反等价于 [^ \f\n\r\t\v]。
\d : 表示10进制数字，等价于 [0-9]
\D : 匹配一个非数字字符。等价于 [^0-9]。
\f : 匹配一个换页符。等价于 \x0c 和 \cL。
\n : 匹配一个换行符。等价于 \x0a 和 \cJ。
\r : 匹配一个回车符。等价于 \x0d 和 \cM。
\t : 匹配一个制表符。等价于 \x09 和 \cI。
\v : 匹配一个垂直制表符。等价于 \x0b 和 \cK。

大括号:{}

大括号的作用是指定重复前面一个字符多少遍:

{N} : 重复N遍
{n,m} : 重复 n~m 遍
{n,} : 至少重复n遍
{,m} : 至多重复m遍

定位符

^ : 匹配输入字符串的开始位置。
$ : 匹配输入字符串的结束位置。
\b : 匹配一个单词边界，也就是指单词和空格间的位置。//例如， ‘er\b’ 可以匹配"never" 中的 ‘er’，但不能匹配 “verb” 中的 ‘er’。
\B : 和\b相反，匹配非单词边界。‘er\B’ 能匹配 “verb” 中的 ‘er’，但不能匹配 “never” 中的 ‘er’。

我的个人博客有空来坐坐
http://www.wangyanan.online

面向Web3，春暖花开

关注

3
点赞
踩
18

收藏

觉得还不错? 一键收藏
0
评论
js字符串方法大全

文章目录string对象构造函数concat方法连接字符串indexOf 获取索引值startsWith endsWith includescharAt charCodeAt codePointA fromCharCodesubstr(fromIndex,length)substring(startIndex,endIndex)slice(startIndex,endIndex)split()分...
复制链接

扫一扫