JS操作字符串的一些常见内置方法
一:前言
在前端项目开发中,我们经常会涉及到处理字符串的各种操作。但是不必担心,JavaScript是很贴心的,给了我们很多内置的方法。这让我们的开发成本大大降低,不必去考虑其内部的实现方法(最好还是有所了解)。拿来会用即可。接下来就让我们开始分析一些比较常用的方法吧!
注意:字符串和数组一样,按照索引来排列。并且所有字符串常用方法, 都不会改变原始字符串, 都是以返回值的形式出现结果 。
二:常见的内置方法
// 转换为字符串 // 方法1 var num=110; var n=num.toString(); //"110" // 方法2 var num=111; var n=String(num); //"111" // 方法3 var num=112; var n="" + num; //"112"
1、charAt与charCodeAt
1) charAt
●作用:charAt() 是找到字符串中指定索引位置的内容返回
●语法:字符串.charAt(索引)
●返回值:该索引位置对应的字符
○如果有该索引位置, 那么就是该索引位置的字符
○如果没有该索引位置, 那么就是 空字符串('')
var str = 'hello world' //使用charAt找到字符串中的某一个内容 var index = str.charAt(2) console.log(index)// l //查找索引为13的内容,因为没有返回是一共空字符串var index1 = str.charAt(13) console.log(index1);// ''
2) charCodeAt
●作用:charCodeAt() 就是返回对应索引位置的 unicode 编码
●语法:字符串.charCodeAt(索引)
●返回值:该索引位置的对应字符的 编码(十进制)
var str = ' hello world' 1/使用charAt找到字符串中的某一个内容var index = str.charCodeAt(4) console.log(index)// 111 // 因为0在 unicode 对照表里面存储的是 111,所以就会返回111
2、indexOf与lastIndexOf
1) indexOf
●作用:indexOf 就是按照字符找到对应的索引
●语法:字符串.indexOf(要查找的字符,开始索引)
●返回值:
○如果有该字符内容, 那么就是该字符的索引位置
○如果没有该字符内容, 就是 -1
var str = 'hello world' //使用indexOf 找到字符串中的某一个内容 var index = str.indexOf('l',0) console.log(index)// 2返回第一个找到的内容的下标后面的就不查找了 var index1 = str.indexof('w',3) console.log(index1);116不管从那个索引开始,索引的位置不变 var index2 = str.indexOf('w',7) console.log(index2);// -1从索引7开始查找没有找到返回-1
2) lastIndexOf
●作用:lastIndexOf 是从后向前检测该字符在字符串内的索引位置
●语法:字符串.indexOf(要查找的字符,开始索引)
●返回值:
○如果有该字符内容, 那么就是该字符的索引位置
○如果没有该字符内容, 就是 -1
var str = 'hello world' //使用lastIndexOf找到字符串中的某一个内容 var index = str.lastIndexOf('l') console.log(index)//9返回第一个找到的内容的下标后面的就不查找了,索引的位置不变 var index = str.lastIndexOf('l',8) console.log(index)//3 返回第一个找到的内容的下标后面的就不查找了,索引的位置不变 var index = str.lastIndexof('w',5) console.log(index)//-1 从后开始查找,开始的索引是5但是前面没有找到w返回-1
3、substring与substr
1) substring
●作用:substring 是用来截取字符串使用的
●语法: substring(从哪个索引开始,到哪个索引截止),包含开始索引,不包含结束索引
●返回值:返回截取到的内容
var str = 'hello world' //使用substring截取字符串中的某一个内容 var res = str. substring(2,8) console.log(res); //llo wo
2) substr
●作用:substr 也是用来截取字符串的
●语法:substr(从哪个索引开始,截取多少个)
●返回值:截取到的内容
var str = 'hello world' //使用substr截取字符串中的某一个内容 var res = str.substr(2,7)//从索引2开始,截取7个 console.log(res);//llo wor
○这个方法和 substring 不一样的是,第二个参数是截取多少个
4、toLowerCase 和 toUpperCase
●作用:这两个方法分别是用来给字母格式的字符串转成 小写字母 和 大写字母 的
●语法:
○字符串.toLowerCase()
○字符串.toUpperCase()
var str = 'hello world' //使用toUppercase转换成大写 var upper = str.toUppercase(console.log(upper)// HELLO WORLD //使用 toLowercase转换成小写 var lower = upper.toLowerCase()console.log(lower) // hello world
5、slice
●作用:截取字符串
●语法:字符串.slice(起始索引,结束索引)
○包含开始的索引对应的内容,不包含结束索引对应的内容
○结束索引不写就直接截取到末尾
●返回值:截取出来的字符串
var str = ' hello world' /使用slice截取字符串 var res = str.slice(1,4) //ell console.log(res); //没有结束的索引直接截取到末尾 var res1 = str.slice(1)//ello world console.log(res1);
6、replace
●作用:用指定的内容替换掉字符串中的内容
●语法:字符串.repalce(被替换的内容,要替换的内容)
○被替换内容 => 换下内容
○要替换内容 => 换上内容
●返回值:替换好的字符串
●注意:内容只能被替换一次,从索引0 的位置开始
var str = 'hello world' //使用replace替换字符串中的内容 var res -str.replace('l','M') console.log(res);// heMlo world console.log(str); // hello world
7、split
●作用:按照切割符号, 把字符串切割开, 放在一个数组里面.
●语法:字符串.split('指定的切割符')
○切割符可以不传递,就会和整体当做一个字符串
○('')空字符串会一位一位的切割
○(' ') 字符串中有空格 会按照原字符串中的空格切割
●返回值:一个用指定切割符切割好的数组
//使用split切割成一个数组var res = str.splitO console.log(res);//E'hello world'] var res1 = str.split('') console.log(res1);//['h', 'e', 'l','l','o',' ','w','o','r', 'l', 'd'] var res2 = str.splitC(' ') console.log(res2);//L'hello', 'world']
8、concat
●作用:字符串拼接也可以说是字符串合并
●语法:字符串.concat(字符串)
●返回值:拼接后的字符串
var str = 'hello world ' var str1 = 'ni hao' //使用concat 切割成一个数组 var res = str.concat( 'ni hao' ) console.log(res); // hello world ni hao var res1 = str.concat(str1) console.log(res1); // hello world ni hao
9、trim
●作用:取出字符串头尾的空白内容
●语法:字符串.trim()
●返回值:去除空白内容以后的字符串
var str = ' hello world ' //使用trim切割成一个数组 var res = str.trim() console.log(res); // hello world
10、trimStart / trimLeft
●作用:去除字符串头部的空白内容
●语法:
○字符串.trimStart()
○字符串.trimLeft()
●返回值:去除空白内容以后的字符串
var str = ' hello world ' //使用trimStart后者trimLeft去除头部的空白内容 var res = str.trimstart() console.log(res);//hello world var res1 = str.trimLeft() console.log(res1); //hello world
11、trimEnd / trimRight
●作用:去除字符串尾部的空白内容
●语法:
○字符串.trimtrimEnd()
○字符串.trimRight()
●返回值:去除空白内容以后的字符串
var str = ' hello world ' //使用trimEnd后者trimRight去除尾部的空白内容 var res = str.trimEnd() console.log(res); // hello world var res1 = str.trimRight( console.log(res1);// hello world
12、search()
●作用:search() 方法用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串。
●语法:
○字符串.search()
●返回值:如果没有找到任何匹配的子串,则返回 -1。
var str="abc DEF!" // 要执行忽略大小写的检索,请追加标志 i。 console.log(str.search(/DEF/))//4
三:结尾
以上就是在JavaScript处理字符串中比较常用到的一些方法,虽然有些不同方法处理结果是相同的,但是在使用性能等方面也各有优劣。各位小伙伴可以根据自己实际的开发需求自行选择。
到此这篇关于JS操作字符串的一些常见内置方法的文章就介绍到这了,更多相关JS操作字符串方法内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
最新评论