js字符串分割處理的幾種方法(6種)
前端開發(fā)中,字符串處理是比較常見的,筆者在最近復(fù)習(xí)的過程中也把它整理了出來。
首先,先來看看js截取三姐妹substring()、subsstr()、slice()
1、slice(start, end)
大姐slice()、從start開始,到end結(jié)束,開始的位置從0不是1,不包括end,支持?jǐn)?shù)組分割,支持負(fù)數(shù),返回數(shù)組
let test = 'hello world!' console.log(test.length) console.log(test.slice(1, 9)) console.log(test.slice(6)) console.log(test.slice(9, 1)) console.log(test.slice(-2)) console.log(test.slice(0, -2)) console.log(test.slice(-4, -2)) console.log(test.slice(-2, 4))
總結(jié)
①第一個參數(shù)比第二個參數(shù)大,結(jié)果返回空字符串
②傳入?yún)?shù)是負(fù)數(shù),slice()會先做運算 test.length + 負(fù)數(shù)參數(shù)。
2、substr(start, length)
二姐substr()、從start開始,返回length長度字符,開始的位置從0不是1,支持負(fù)數(shù),不支持?jǐn)?shù)組
let test = 'hello world!' console.log(test.length) console.log(test.substr(1, 9)) console.log(test.substr(6)) console.log(test.substr(9, 9)) console.log(test.substr(20)) console.log(test.substr(-2)) console.log(test.substr(-8, 4)) console.log(test.substr(-8, 0)) console.log(test.substr(-8, -4)) console.log(test.substr(-20))
總結(jié)
①傳入?yún)?shù)超過length返回空字符串
②傳入負(fù)數(shù),則從字符串的尾部開始算起始位置,-1指最后一個字符,-2指倒數(shù)第二個字符;當(dāng)傳入的第一個參數(shù)是負(fù)數(shù)且它的絕對值超過length,這個負(fù)數(shù)轉(zhuǎn)化為0,當(dāng)傳入的第二個參數(shù)是負(fù)數(shù),等價于0,截取0個字符,返回空字符串。
3、substring(start, stop)
三姐substring()、不接受負(fù)數(shù),從 start 開始,不包括stop,開始的位置從0不是1,不支持?jǐn)?shù)組
let test = 'hello world!' console.log(test.length) console.log(test.substring(1, 9)) console.log(test.substring(6)) console.log(test.substring(9, 9)) console.log(test.substring(20)) console.log(test.substring(-2)) console.log(test.substring(-8, 4)) console.log(test.substring(-8, 0)) console.log(test.substring(-8, -4)) console.log(test.substring(-20))
總結(jié)
①第二個參數(shù)==第一個參數(shù),返回空字符串
②傳入兩個參數(shù),不管在第一還是第二位置,都會將小的參數(shù)作為第一個參數(shù),較大的作為第二個參數(shù)
③任何一個參數(shù)為負(fù)數(shù)或者NaN的時候,自動將其轉(zhuǎn)換為0
④任何一個參數(shù)大于length,按照length處理
js字符串截取三姐妹,都不會對原始的字符串進(jìn)行修改,而是返回新的子集。但是三姐妹各自有各自的個性,面對同一種參數(shù)處理的方式都是不一樣的。
4、split(separator, length)
字符按照字符串或正則分割,輸出一個數(shù)組,length表示返回的長度,不支持?jǐn)?shù)組;
//以空格為分隔符輸出數(shù)組 var str = '123 abc 1 2 3 a b c ' var arr = str.split(' ') console.log(arr)
var str = '123 abc 1 2 3 a b c' var arr = str.split(' ', 4) //第二個參數(shù)表示返回數(shù)組的最大長度!注意不是原來字符串的,是新輸出的數(shù)組的 console.log(arr)
5、join(separator)
將數(shù)組合并成字符串,用 separator隔離,不支持字符串
var a = ['I', 'am', 'a', 'girl', '英文名', '是', 'gaby'] var arr = a.join(',') console.log(arr)
6、splice(start, length, …args)
數(shù)組操作函數(shù),增刪改查,不支持字符串,返回數(shù)組,從 start開始,刪除的length長度,并按args參數(shù)個數(shù)添加到 start位置
//刪,第一個參數(shù)為第一項位置,第二個參數(shù)為要刪除幾個 0數(shù)起 //array.splice(index,num),返回值為刪除內(nèi)容,array為結(jié)果值 var arr = ['a', 'b', 'c', 'd', 'e', 'f'] console.log(arr.splice(0, 4)) console.log(arr)
//增,第一個參數(shù)(插入位置),第二個參數(shù)(0),第三個參數(shù)(插入的項) //array.splice(index,0,insertValue),返回值為空數(shù)組,array值為最終結(jié)果值 var arr = ['a', 'b', 'c', 'd', 'e', 'f'] console.log(arr.splice(2, 0, 'insert')) console.log(arr)
//改 第一個參數(shù)(起始位置),第二個參數(shù)(刪除的項數(shù)),第三個參數(shù)(插入任意數(shù)量的項) //array.splice(index,num,insertValue),返回值為刪除內(nèi)容,array為結(jié)果值 var arr = ['a', 'b', 'c', 'd', 'e', 'f'] console.log(arr.splice(2, 1, 'delete')) console.log(arr)
到此這篇關(guān)于js字符串分割處理的幾種方法(6種)的文章就介紹到這了,更多相關(guān)js字符串分割處理內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
一道面試題引發(fā)的對javascript類型轉(zhuǎn)換的思考
本文主要介紹了javascript類型轉(zhuǎn)換的相關(guān)知識,具有很好的參考價值。下面跟著小編一起來看下吧2017-03-03利用JS判斷用戶是否上網(wǎng)(連接網(wǎng)絡(luò))
本篇文章主要介紹了利用JS判斷用戶是否上網(wǎng)(連接網(wǎng)絡(luò))。需要的朋友可以過來參考下,希望對大家有所幫助2013-12-12JS獲得鼠標(biāo)位置(兼容多瀏覽器ie,firefox)腳本之家修正版
這段代碼經(jīng)過測試,支持ie和ff是個不錯的代碼,并修正了錯誤,希望大家先運行測試下2008-11-11javascript 網(wǎng)站常用的iframe分割
就是一個頁面使用兩個iframe來調(diào)用內(nèi)容,實現(xiàn)頁面導(dǎo)航,更容易控制,可控制性好2008-06-06JavaScript關(guān)聯(lián)數(shù)組用法分析【概念、定義、遍歷】
這篇文章主要介紹了JavaScript關(guān)聯(lián)數(shù)組用法,結(jié)合實例形式分析了關(guān)聯(lián)數(shù)組的概念、定義與遍歷操作相關(guān)實現(xiàn)技巧,需要的朋友可以參考下2017-03-03原生js實現(xiàn)可兼容PC和移動端的拖動滑塊功能詳解【測試可用】
這篇文章主要介紹了原生js實現(xiàn)可兼容PC和移動端的拖動滑塊功能,結(jié)合實例形式詳細(xì)分析了javascript事件響應(yīng)及頁面元素屬性動態(tài)操作實現(xiàn)滑塊拖動功能的相關(guān)操作技巧,需要的朋友可以參考下2019-08-08JavaScript setTimeout()基本用法有哪些
這篇文章主要介紹了JavaScript setTimeout()基本用法有哪些,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-11-11