javascript中字符串處理常用的方法匯總
前言
雖然 JavaScript 有很多用處,但是處理字符串是其中最流行的一個(gè)。下面讓我們深入地分析一下使用 JavaScript 操作字符串。
在 JavaScript 中, String 是對(duì)象。 String 對(duì)象并不是以字符數(shù)組的方式存儲(chǔ)的,所以我們必須使用內(nèi)建函數(shù)來(lái)操縱它們的值。這些內(nèi)建函數(shù)提供了不同的方法來(lái)訪問(wèn)字符串變量的內(nèi)容。下面我們?cè)敿?xì)看一下這些函數(shù)。
操作字符串的值是一般的開(kāi)發(fā)人員必須面臨的家常便飯。操作字符串的具體方式有很多,比如說(shuō)從一個(gè)字符串是提取出一部分內(nèi)容來(lái),或者確定一個(gè)字符串是否包含一個(gè)特定的字符。
下面景天就 JavaScript 字符串處理相關(guān)函數(shù)做深入講述:
1.獲取字符串長(zhǎng)度 length
var string = "to be or not to be";
var res = string.length
var res = string[-1]
console.log(res)
2.通過(guò)索引獲取元素 charAt 不支持負(fù)下標(biāo) 第幾個(gè)位置的字符
var string = "to be or not to be"; var res = string.charAt(3) console.log(res)

也可以直接通過(guò)string[3]下標(biāo)獲取
3.charCodeAt() 拿到字符串對(duì)應(yīng)字母的ASCII的編碼


如果字符串中是中文,拿到的是Unicode碼


字符串進(jìn)行加密的時(shí)候,中文不太好加密,我們可以通過(guò)Unicode碼進(jìn)行數(shù)學(xué)運(yùn)算,進(jìn)行加密
通過(guò)String.fromCharCode(20013) 還原成中文



4.清除兩側(cè)的空白 trim()
var res = string.trim() console.log(string) console.log(res)


5.獲取首次出現(xiàn)的位置 indexOf
/*找不到返回-1*/
var string = "to be or not to be";
var res = string.indexOf("z")
console.log(res)

找不到返回-1

找到,返回索引下標(biāo)


6.最后一次出現(xiàn)的位置 lastIndexOf
/*找不到返回-1*/
var res = string.lastIndexOf("zzz")
console.log(res);
找到第一個(gè)字母最后出現(xiàn)的下標(biāo)


7.連接字符串concat
var res = string.concat("d:\\","python32\\","day42");
console.log(res);


8.截取字符串 slice 只能正向截取。沒(méi)有步長(zhǎng)。加上也不報(bào)錯(cuò)
/* string.slice(開(kāi)始值,結(jié)束值) 字符串的切片 留頭舍尾 [支持逆向下標(biāo)]*/ var string = "11122233e or not to be"; var res = string.slice(1,7); var res = string.slice(-5,-1); // to b // var res = string.slice(-5,-10); //截取不到返回空 console.log(res,"<==1==>")
截取,取頭舍尾,只能正向截取,逆向截取,獲取不到


不支持逆向截取


9.截取字符串 substr
/* string.substr(開(kāi)始值,截取幾個(gè)) */ var string = "11122233e or not to be"; var res = string.substr(3,4) console.log(res,"<==2==>")

substring是從中截取一段字符串,在組成一個(gè)新的字符串

截取方式:顧頭不顧尾
str.substring(indexA, indexB)
以下標(biāo)從零開(kāi)始計(jì)數(shù);包含indexA,不包含indexB
如果inde新A與indexB相等,則返回一個(gè)空字符串

其中字符串中的空格也算是一個(gè)字符串。
當(dāng)有一個(gè)參數(shù)時(shí)
str.substring(indexA)
當(dāng)有一個(gè)參數(shù)時(shí),就是從indexA往后所有的字符

如果第二參數(shù)是負(fù)數(shù),則從零開(kāi)始計(jì)數(shù) 如果任一參數(shù)小于0或是NaN,它將被視為0。 如果indexStart大于indexEnd,那么效果和被交換一樣
str.substring(indexA, indexB)

includes()
ES6中引入的JavaScript include()方法確定字符串是否包含您傳遞給該方法的字符。如果字符串包含某些字符,則該方法將返回“ true”。
如果指定的字符串不包含您要查找的字符,則includes()將返回“ false”。
10.拆分字符串 split
var string = "11122233e or not to be";
var res = string.split(" ")
console.log(res,"<==3==>")
返回?cái)?shù)組

11.大小寫 toUpperCase toLowerCase
var string = "11122233e Or noT tO be"; res = string.toUpperCase(); res = string.toLowerCase(); console.log(res,"<==4==>")
轉(zhuǎn)換成大寫


12.search 匹配第一次找到的索引位置,找不到返回-1 匹配字符串要帶上雙斜線
var string = "aaabbb oldaoy ccc" var res = string.search(/oldboy/) console.log(res,"<==5==>")
返回第一個(gè)字母出現(xiàn)的下標(biāo)


13.match 返回匹配的數(shù)據(jù)
/* /正則表達(dá)式/修飾符 g:全局匹配 i:不區(qū)分大小寫 m:多行匹配 */
var string = "我的電話是 : 13838384388 你的電話是: 13854381438"
var res = string.match(/\d{11}/); // 匹配一個(gè)
var res = string.match(/\d{11}/g); // 匹配多個(gè),(需要修飾符加上g)
console.log(res)
console.log(res[0])
console.log(res[1])
返回的是數(shù)組。不加g匹配第一個(gè)后,就不再匹配。res[1]沒(méi)匹配到,打印出undefined

加上g后,全量匹配,都可以匹配到


14.字符串替換 replace
/* replace默認(rèn)只替換一次 */
var string = "to be or not to be";
var res = string.replace("to","two")
console.log(res,"<==6==>")
默認(rèn)只替換一次,替換第一個(gè)


替換所有的方法
方法一:
function myreplace(string,a,b){
/*
找最后一個(gè)to,如果找不到返回-1
如果能找到就不停的進(jìn)行替換,直到-1為止,循環(huán)終止;
*/
while(string.lastIndexOf(a) != -1){
console.log(1)
string = string.replace(a,b);
}
return string;
}
var string = "to be or not to be";
var res = myreplace(string,"to","two")
console.log(res) // two be or not two be
循環(huán)替換完成,1前面的2表示循環(huán)跑了2次

方法二,在要被替換的字符串后面加g,表示全量替換
var string = "to be or not to be"; var res = string.replace(/to/g,"two"); console.log(res)

總結(jié)
到此這篇關(guān)于javascript中字符串處理的文章就介紹到這了,更多相關(guān)js字符串處理方法內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
js中flexible.js實(shí)現(xiàn)淘寶彈性布局方案
這篇文章主要為大家詳細(xì)介紹了js中flexible.js實(shí)現(xiàn)淘寶彈性布局方案,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2015-12-12
JavaScript實(shí)現(xiàn)圖片懶加載的三種常用方法總結(jié)
懶加載是一種對(duì)網(wǎng)頁(yè)性能優(yōu)化的方式,也是我們經(jīng)常會(huì)用到的技術(shù),這篇文章為大家整理了JavaScript實(shí)現(xiàn)圖片懶加載的三種常用方法,希望對(duì)大家有所幫助2023-06-06
使用javascript實(shí)現(xiàn)判斷當(dāng)前瀏覽器
這篇文章主要介紹了使用javascript實(shí)現(xiàn)判斷當(dāng)前瀏覽器的類型及版本,雖然不是很全面,但是還是推薦給大家,簡(jiǎn)單學(xué)下方法和思路。2015-04-04
JavaScript利用Date實(shí)現(xiàn)簡(jiǎn)單的倒計(jì)時(shí)實(shí)例
在日常開(kāi)發(fā)的時(shí)候經(jīng)常遇到關(guān)于倒計(jì)時(shí)的需求,下面這篇文章就給主要介紹了JavaScript利用Date實(shí)現(xiàn)倒計(jì)時(shí)效果的方法示例,文中主要實(shí)現(xiàn)了倒計(jì)時(shí)和倒計(jì)時(shí)結(jié)束搶購(gòu)的按鈕才可以被點(diǎn)擊的效果,有需要的朋友可以參考借鑒。2017-01-01
JavaScript通過(guò)事件代理高亮顯示表格行的方法
這篇文章主要介紹了JavaScript通過(guò)事件代理高亮顯示表格行的方法,涉及javascript事件代理及頁(yè)面元素的操作技巧,需要的朋友可以參考下2015-05-05
JS中Promise.all 和 Promise.allsettled區(qū)別小結(jié)
本文主要介紹了JS中Promise.all 和 Promise.allsettled區(qū)別小結(jié),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2026-05-05
JS 通過(guò)系統(tǒng)時(shí)間限定動(dòng)態(tài)添加 select option的實(shí)例代碼
這篇文章主要介紹了JS 通過(guò)系統(tǒng)時(shí)間限定 動(dòng)態(tài)添加 select option的實(shí)例代碼,非常不錯(cuò)具有參考借鑒價(jià)值,需要的朋友可以參考下2016-06-06

