面試中臣酚妫考的字符串操作方法大全,包含ES6

面試中撤缣猓考的字符串操作方法大全判导,包含ES6

2019-01-08JavaScript?|?字符串1739View0

對于JavaScript字符串操作方法,你真的全部掌握了嗎沛硅?來看看這篇面試中逞廴校考的字符串操作大全,包含最新的ES6字符串操作方法摇肌,值得收藏哦擂红。

一、charAt()

返回在指定位置的字符围小。

varstr="abc"console.log(str.charAt(0))//a

二昵骤、charCodeAt()

返回在指定的位置的字符的 Unicode 編碼树碱。

varstr="abc"console.log(str.charCodeAt(1))//98

三、concat()

連接字符串涉茧。

vara ="abc";varb ="def";varc= a.concat(b); console.log(c);//abcdef

四赴恨、indexOf()

檢索字符串疹娶。indexOf() 方法對大小寫敏感伴栓!

varstr="Hello world!"console.log(str.indexOf("Hello"))//0console.log(str.indexOf("World"))//-1console.log(str.indexOf("world"))///6

五、match()

match() 方法可在字符串內(nèi)檢索指定的值雨饺,或找到一個或多個正則表達(dá)式的匹配钳垮。該方法類似 indexOf() 和 lastIndexOf(),但是它返回指定的值额港,而不是字符串的位置饺窿。

varstr="1 abc 2 def 3"console.log(str.match(/\d+/g))//123

六、replace()

replace() 方法用于在字符串中用一些字符替換另一些字符移斩,或替換一個與正則表達(dá)式匹配的子串肚医。

varstr="abc Def!"console.log(str.replace(/abc/,"CBA"))//CBA Def!

七、search()

search() 方法用于檢索字符串中指定的子字符串向瓷,或檢索與正則表達(dá)式相匹配的子字符串肠套。要執(zhí)行忽略大小寫的檢索,請追加標(biāo)志 i猖任。如果沒有找到任何匹配的子串你稚,則返回 -1。

varstr="abc DEF!"console.log(str.search(/DEF/))//4

八朱躺、slice()

提取字符串的片斷刁赖,并在新的字符串中返回被提取的部分。

stringObject.slice(start,end);

start:要抽取的片斷的起始下標(biāo)长搀。如果是負(fù)數(shù)宇弛,則該參數(shù)規(guī)定的是從字符串的尾部開始算起的位置。也就是說源请,-1 指字符串的最后一個字符枪芒,-2 指倒數(shù)第二個字符,以此類推巢钓。

end:緊接著要抽取的片段的結(jié)尾的下標(biāo)病苗。若未指定此參數(shù),則要提取的子串包括 start 到原字符串結(jié)尾的字符串症汹。如果該參數(shù)是負(fù)數(shù)硫朦,那么它規(guī)定的是從字符串的尾部開始算起的位置。

varstr="abc def ghk"console.log(str.slice(6))//f ghk

九背镇、split()

把字符串分割為字符串?dāng)?shù)組咬展。

var str="abc def ghi jkl"console.log(str.split(" "))//["abc","def","ghi","jkl"]console.log(str.split("") )//["a","b","c"," ","d","e","f"," ","g","h","i"," ","j","k","l"]console.log(str.split(" ",3))//["abc","def","ghi"]

十泽裳、toLocaleLowerCase()

把字符串轉(zhuǎn)換為小寫。

varstr="ABC def!"console.log(str.toLocaleLowerCase())//abc def!

十一破婆、toLocaleUpperCase()

把字符串轉(zhuǎn)換為大寫涮总。

varstr="ABC def!"console.log(str.toLocaleUpperCase())//ABC DEF!

十二、toLowerCase()

把字符串轉(zhuǎn)換為小寫祷舀。

varstr="ABC def!"console.log(str.toLowerCase())//abc def!

十三瀑梗、toUpperCase()

把字符串轉(zhuǎn)換為大寫。

varstr="ABC def!"console.log(str.toUpperCase())//ABC DEF!

十四裳扯、substr()

從起始索引號提取字符串中指定數(shù)目的字符抛丽。

stringObject.substr(start,length)。

start:必需饰豺。要抽取的子串的起始下標(biāo)亿鲜。必須是數(shù)值。如果是負(fù)數(shù)冤吨,那么該參數(shù)聲明從字符串的尾部開始算起的位置蒿柳。也就是說,-1 指字符串中最后一個字符漩蟆,-2 指倒數(shù)第二個字符垒探,以此類推。

length:可選爆安。子串中的字符數(shù)叛复。必須是數(shù)值。如果省略了該參數(shù)扔仓,那么返回從 stringObject 的開始位置到結(jié)尾的字串褐奥。

varstr="abc def"console.log(str.substr(2))//c defconsole.log(str.substr(2,4))// c de

十五、substring()

提取字符串中兩個指定的索引號之間的字符翘簇。

stringObject.substring(start,stop)撬码。

start :必需。一個非負(fù)的整數(shù)版保,規(guī)定要提取的子串的第一個字符在 stringObject 中的位置呜笑。

stop :可選。一個非負(fù)的整數(shù)彻犁,比要提取的子串的最后一個字符在 stringObject 中的位置多 1叫胁。如果省略該參數(shù),那么返回的子串會一直到字符串的結(jié)尾汞幢。

varstr="abc def"console.log(str.substring(2))//c defconsole.log(str.substring(2,4))// c

相同點(diǎn):如果只是寫一個參數(shù)驼鹅,兩者的作用都一樣:都是是截取字符串從當(dāng)前下標(biāo)以后直到字符串最后的字符串片段。

substr(startIndex);

substring(startIndex);

varstr ='123456789';console.log(str.substr(2));//? "3456789"console.log(str.substring(2)) ;//? "3456789"

不同點(diǎn):第二個參數(shù)

substr(startIndex,lenth): 第二個參數(shù)是截取字符串的長度(從起始點(diǎn)截取某個長度的字符串);

substring(startIndex, endIndex): 第二個參數(shù)是截取字符串最終的下標(biāo) (截取2個位置之間的字符串,‘含頭不含尾’)输钩。

console.log("123456789".substr(2,5));//? "34567"console.log("123456789".substring(2,5)) ;//? "345"

ES6新增的操作字符串的方法

一豺型、codePointAt()

lets ='??a';s.codePointAt(0)// 134071s.codePointAt(1)// 57271s.codePointAt(2)// 97

codePointAt方法的參數(shù),是字符在字符串中的位置(從 0 開始)买乃。上面代碼中姻氨,JavaScript?將“??a”視為三個字符,codePointAt 方法在第一個字符上剪验,正確地識別了“??”肴焊,返回了它的十進(jìn)制碼點(diǎn) 134071(即十六進(jìn)制的20BB7)。在第二個字符(即“??”的后兩個字節(jié))和第三個字符“a”上碉咆,codePointAt方法的結(jié)果與charCodeAt方法相同抖韩。

二蛀恩、String.fromCodePoint()

ES5 提供String.fromCharCode方法疫铜,用于從碼點(diǎn)返回對應(yīng)字符,但是這個方法不能識別 32 位的 UTF-16 字符(Unicode 編號大于0xFFFF)双谆。

String.fromCharCode(0x20BB7)// "?"

上面代碼中壳咕,String.fromCharCode不能識別大于0xFFFF的碼點(diǎn),所以0x20BB7就發(fā)生了溢出顽馋,最高位2被舍棄了谓厘,最后返回碼點(diǎn)U+0BB7對應(yīng)的字符,而不是碼點(diǎn)U+20BB7對應(yīng)的字符寸谜。

ES6 提供了String.fromCodePoint方法竟稳,可以識別大于0xFFFF的字符,彌補(bǔ)了String.fromCharCode方法的不足熊痴。在作用上他爸,正好與codePointAt方法相反。

String.fromCodePoint(0x20BB7)// "??"String.fromCodePoint(0x78,0x1f680,0x79) ==='x\uD83D\uDE80y'// true

三果善、字符串的遍歷器接口 for of

for(letcodePointof'abc') {console.log(codePoint)}// "a"http:// "b"http:// "c"

除了遍歷字符串诊笤,這個遍歷器最大的優(yōu)點(diǎn)是可以識別大于0xFFFF的碼點(diǎn),傳統(tǒng)的for循環(huán)無法識別這樣的碼點(diǎn)巾陕。

四讨跟、at()

at方法可以識別Unicode 編號大于0xFFFF的字符,返回正確的字符鄙煤。

‘a(chǎn)bc’.at(0)//"a"'吉'.at(0)//"吉"

五晾匠、normalize()

許多歐洲語言有語調(diào)符號和重音符號。為了表示它們梯刚,Unicode 提供了兩種方法凉馆。一種是直接提供帶重音符號的字符,比如ǒ(u01D1)。另一種是提供合成符號(combining character)句喜,即原字符與重音符號的合成预愤,兩個字符合成一個字符,比如O(u004F)和ˇ(u030C)合成ǒ(u004Fu030C)咳胃。

這兩種表示方法植康,在視覺和語義上都等價,但是?JavaScript?不能識別展懈。

'\u01D1'==='\u004F\u030C'//false? ? '\u01D1'.length// 1'\u004F\u030C'.length// 2

上面代碼表示销睁,JavaScript 將合成字符視為兩個字符,導(dǎo)致兩種表示方法不相等存崖。

ES6 提供字符串實例的normalize()方法冻记,用來將字符的不同表示方法統(tǒng)一為同樣的形式,這稱為 Unicode 正規(guī)化来惧。

'\u01D1'.normalize() ==='\u004F\u030C'.normalize()// true

六冗栗、includes(), startsWith(), endsWith()

傳統(tǒng)上,JavaScript 只有indexOf方法供搀,可以用來確定一個字符串是否包含在另一個字符串中隅居。ES6 又提供了三種新方法。

**includes()**:返回布爾值葛虐,表示是否找到了參數(shù)字符串胎源。**startsWith()**:返回布爾值,表示參數(shù)字符串是否在原字符串的頭部屿脐。**endsWith()**:返回布爾值涕蚤,表示參數(shù)字符串是否在原字符串的尾部。lets ='Hello world!';? ? s.startsWith('Hello')// trues.endsWith('!')// trues.includes('o')// true

這三個方法都支持第二個參數(shù)的诵,表示開始搜索的位置万栅。

lets ='Hello world!';? ? s.startsWith('world',6)// trues.endsWith('Hello',5)// trues.includes('Hello',6)// false

上面代碼表示,使用第二個參數(shù)n時奢驯,endsWith的行為與其他兩個方法有所不同申钩。它針對前n個字符,而其他兩個方法針對從第n個位置直到字符串結(jié)束瘪阁。

七撒遣、repeat()

repeat方法返回一個新字符串,表示將原字符串重復(fù)n次管跺。

'x'.repeat(3) //"xxx"'hello'.repeat(2) //"hellohello"'na'.repeat(0) //""

參數(shù)如果是小數(shù)义黎,會被取整。

'na'.repeat(2.9) //"nana"

如果repeat的參數(shù)是負(fù)數(shù)或者Infinity豁跑,會報錯廉涕。

'na'.repeat(Infinity)// RangeError'na'.repeat(-1)// RangeError

八、padStart(),padEnd()

ES2017 引入了字符串補(bǔ)全長度的功能狐蜕。如果某個字符串不夠指定長度宠纯,會在頭部或尾部補(bǔ)全。padStart()用于頭部補(bǔ)全层释,padEnd()用于尾部補(bǔ)全婆瓜。

'x'.padStart(5,'ab')// 'ababx''x'.padStart(4,'ab')// 'abax''x'.padEnd(5,'ab')// 'xabab''x'.padEnd(4,'ab')// 'xaba'

上面代碼中,padStart和padEnd一共接受兩個參數(shù)贡羔,第一個參數(shù)用來指定字符串的最小長度廉白,第二個參數(shù)是用來補(bǔ)全的字符串。

如果原字符串的長度乖寒,等于或大于指定的最小長度猴蹂,則返回原字符串。

'xxx'.padStart(2,'ab')// 'xxx''xxx'.padEnd(2,'ab')// 'xxx'

如果用來補(bǔ)全的字符串與原字符串楣嘁,兩者的長度之和超過了指定的最小長度磅轻,則會截去超出位數(shù)的補(bǔ)全字符串。

'abc'.padStart(10,'0123456789')// '0123456abc'

如果省略第二個參數(shù)马澈,默認(rèn)使用空格補(bǔ)全長度瓢省。

'x'.padStart(4)// '? x''x'.padEnd(4)// 'x? '

padStart的常見用途是為數(shù)值補(bǔ)全指定位數(shù)。下面代碼生成 10 位的數(shù)值字符串痊班。

'1'.padStart(10,'0')// "0000000001"'12'.padStart(10,'0')// "0000000012"'123456'.padStart(10,'0')// "0000123456"

另一個用途是提示字符串格式。

'12'.padStart(10,'YYYY-MM-DD')// "YYYY-MM-12"'09-12'.padStart(10,'YYYY-MM-DD')// "YYYY-09-12"

九摹量、matchAll()

matchAll方法返回一個正則表達(dá)式在當(dāng)前字符串的所有匹配涤伐。

十、字符串模板

模板字符串(template string)是增強(qiáng)版的字符串缨称,用反引號(`)標(biāo)識凝果。它可以當(dāng)作普通字符串使用,也可以用來定義多行字符串睦尽,或者在字符串中嵌入變量器净。-----字符串模板,工作中用到比較多当凡。

// 普通字符串`In JavaScript '\n' is a line-feed.`// 多行字符串`In JavaScript this is

not legal.`console.log(`string text line 1

string text line 2`);// 字符串中嵌入變量letname ="Bob", time ="today";`Hello${name}, how are you${time}?`

上面代碼中的模板字符串山害,都是用反引號表示。如果在模板字符串中需要使用反引號沿量,則前面要用反斜杠轉(zhuǎn)義浪慌。

letgreeting =`\`Yo\` World!`;

如果使用模板字符串表示多行字符串,所有的空格和縮進(jìn)都會被保留在輸出之中朴则。

$('#list').html(`

  • first
  • second
`);

上面代碼中权纤,所有模板字符串的空格和換行,都是被保留的,比如<ul>標(biāo)簽前面會有一個換行汹想。如果你不想要這個換行外邓,可以使用trim方法消除它。

$('#list').html(`

  • first
  • second
`.trim());

模板字符串中嵌入變量古掏,需要將變量名寫在${}之中坐榆。

functionauthorize(user, action){if(!user.hasPrivilege(action)) {thrownewError(// 傳統(tǒng)寫法為// 'User '// + user.name// + ' is not authorized to do '// + action// + '.'`User${user.name}is not authorized to do${action}.`);? }}

大括號內(nèi)部可以放入任意的 JavaScript 表達(dá)式,可以進(jìn)行運(yùn)算冗茸,以及引用對象屬性席镀。

letx =1;lety =2;`${x}+${y}=${x + y}`// "1 + 2 = 3"`${x}+${y * 2}=${x + y * 2}`// "1 + 4 = 5"letobj = {x:1, y:2};`${obj.x + obj.y}`// "3"

模板字符串之中還能調(diào)用函數(shù)。

functionfn(){return"Hello World";}`foo${fn()}bar`// foo Hello World bar

如果大括號中的值不是字符串夏漱,將按照一般的規(guī)則轉(zhuǎn)為字符串豪诲。比如,大括號中是一個對象挂绰,將默認(rèn)調(diào)用對象的toString方法屎篱。

如果模板字符串中的變量沒有聲明,將報錯葵蒂。

// 變量place沒有聲明letmsg =`Hello,${place}`;// 報錯

由于模板字符串的大括號內(nèi)部交播,就是執(zhí)行 JavaScript 代碼,因此如果大括號內(nèi)部是一個字符串践付,將會原樣輸出秦士。

`Hello${'World'}`// "Hello World"

模板字符串甚至還能嵌套。

const tmpl = addrs => `${addrs.map(addr => ``).join('')}${addr.first}${addr.last}`;

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末永高,一起剝皮案震驚了整個濱河市隧土,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌命爬,老刑警劉巖曹傀,帶你破解...
    沈念sama閱讀 217,542評論 6 504
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異饲宛,居然都是意外死亡皆愉,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,822評論 3 394
  • 文/潘曉璐 我一進(jìn)店門艇抠,熙熙樓的掌柜王于貴愁眉苦臉地迎上來幕庐,“玉大人,你說我怎么就攤上這事练链∠柰眩” “怎么了?”我有些...
    開封第一講書人閱讀 163,912評論 0 354
  • 文/不壞的土叔 我叫張陵媒鼓,是天一觀的道長届吁。 經(jīng)常有香客問我错妖,道長,這世上最難降的妖魔是什么疚沐? 我笑而不...
    開封第一講書人閱讀 58,449評論 1 293
  • 正文 為了忘掉前任暂氯,我火速辦了婚禮,結(jié)果婚禮上亮蛔,老公的妹妹穿的比我還像新娘痴施。我一直安慰自己,他們只是感情好究流,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,500評論 6 392
  • 文/花漫 我一把揭開白布辣吃。 她就那樣靜靜地躺著,像睡著了一般芬探。 火紅的嫁衣襯著肌膚如雪神得。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,370評論 1 302
  • 那天偷仿,我揣著相機(jī)與錄音哩簿,去河邊找鬼。 笑死酝静,一個胖子當(dāng)著我的面吹牛节榜,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播别智,決...
    沈念sama閱讀 40,193評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼宗苍,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了亿遂?” 一聲冷哼從身側(cè)響起浓若,我...
    開封第一講書人閱讀 39,074評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎蛇数,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體是越,經(jīng)...
    沈念sama閱讀 45,505評論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡耳舅,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,722評論 3 335
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了倚评。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片浦徊。...
    茶點(diǎn)故事閱讀 39,841評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖天梧,靈堂內(nèi)的尸體忽然破棺而出盔性,到底是詐尸還是另有隱情,我是刑警寧澤呢岗,帶...
    沈念sama閱讀 35,569評論 5 345
  • 正文 年R本政府宣布冕香,位于F島的核電站蛹尝,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏悉尾。R本人自食惡果不足惜突那,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,168評論 3 328
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望构眯。 院中可真熱鬧愕难,春花似錦、人聲如沸惫霸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,783評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽壹店。三九已至猜丹,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間茫打,已是汗流浹背居触。 一陣腳步聲響...
    開封第一講書人閱讀 32,918評論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留老赤,地道東北人轮洋。 一個月前我還...
    沈念sama閱讀 47,962評論 2 370
  • 正文 我出身青樓,卻偏偏與公主長得像抬旺,于是被迫代替她去往敵國和親弊予。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,781評論 2 354

推薦閱讀更多精彩內(nèi)容

  • 1.charAt 返回指定索引出的字符 var str='abcd'; var a=str.charAt(0); ...
    VivaLaVida_692c閱讀 504評論 0 1
  • 字符的 Unicode 表示法 codePointAt() String.fromCodePoint() 字符串的...
    卞卞村長L閱讀 749評論 0 0
  • 人生的經(jīng)歷是一道靚麗的風(fēng)景开财,過程不論是曲折汉柒、坎坷、艱辛還是順暢责鳍,只因走過而美麗碾褂;人生的命運(yùn),也因努力而頗見精彩历葛;生...
    efab227f5376閱讀 1,520評論 5 41
  • 今天上夜班正塌,剛剛打電話,是嘉馳爸爸在家輔導(dǎo)的孩子恤溶,兒子的語文作業(yè)乓诽,數(shù)學(xué)作業(yè),讀經(jīng)打卡咒程,還有古詩《古朗月行》都完成的...
    李嘉馳閱讀 186評論 0 0