JS字符串的操作

在JS中伐谈,字符串是六種數(shù)據(jù)類型之一烂完,其重要程度不言而喻。JS中有一系列的內(nèi)置方法可以對(duì)字符串進(jìn)行操作诵棵,下面就一起來看看吧抠蚣。

一、字符串簡(jiǎn)介

  • 字符串的定義
    字符串是零個(gè)或多個(gè)字符按照序列進(jìn)行排列而組成履澳,通常放在單引號(hào)或雙引號(hào)中嘶窄;

二、多行字符串與字符串的轉(zhuǎn)義

  • 多行字符串
    • 為何需要多行字符串
      主要原因是方便在敲代碼的時(shí)候避免寫過長(zhǎng)的字符串導(dǎo)致代碼可讀性降低距贷;
    • 創(chuàng)建多行字符串的方法

1.使用+號(hào)對(duì)多個(gè)字符串進(jìn)行連接柄冲,如下例子:

    var a = '我叫小明'
    + '我有一個(gè)心儀的女神'
    + '每次我找她聊天'
    + '很不巧她都說要洗澡';

2.直接換行,然后用反斜杠\將換行轉(zhuǎn)義:

    var a = '我叫小明\
    我有一個(gè)心儀的女神\
    每次我找她聊天\
    很不巧她都說要洗澡';

3.使用注釋的方法忠蝗,不過這個(gè)方法并不常用:

(function () { /*
我叫小明
我有一個(gè)心儀的女神
每次我找她聊天
很不巧她都說要去洗澡
*/}).toString().split('\n').slice(1,-1).join('\n')
  • 關(guān)于字符串的轉(zhuǎn)義
    在JS中现横,敲字符串時(shí)可以使用單引號(hào)或者雙引號(hào)進(jìn)行包裹,但是有一點(diǎn)要注意的阁最,如果字符串本身有單引號(hào)戒祠,那么外層包裹的就要是雙引號(hào),比如下圖:

    此外速种,還可以使用字符串轉(zhuǎn)義符號(hào)\對(duì)其中的引號(hào)進(jìn)行轉(zhuǎn)義姜盈,使其失去引號(hào)功能,成為一個(gè)普通的字符配阵;
    • 轉(zhuǎn)義符號(hào)\
      例如上面的例子贩据,使用轉(zhuǎn)義符號(hào)的話就無需注意外層的引號(hào)了:


      PS:轉(zhuǎn)義符號(hào)\放置在需要轉(zhuǎn)義的字符前面;

    • 此外闸餐,還有一些其它的特殊字符也需要進(jìn)行轉(zhuǎn)義

代碼 輸出
' 單引號(hào)'
" 雙引號(hào)"
\n 換行符
\r 回車符
\t 制表符
\b 退格符
\ 單個(gè)反斜杠 \
\t 制表符
\f 換頁符
& 與符號(hào)

三饱亮、常用的字符串操作方法

  • 字符串長(zhǎng)度和索引
    • 字符串長(zhǎng)度(length)
      字符串可以使用length來獲取其自身的字符長(zhǎng)度:
      不過需要注意上面的轉(zhuǎn)義字符,例如\n只是一個(gè)字符舍沙。

      字符串長(zhǎng)度獲取

    • 字符串索引(下標(biāo)近上、charAt()、charCodeAt())
      1.字符串的下標(biāo) :
      字符串是字符的有序排列拂铡,那么就可以通過字符串的下標(biāo)對(duì)其中的字符進(jìn)行檢索壹无,例子如下:

      下標(biāo)檢索字符串

      此外也可以通過length直接定位到倒數(shù)的字符

      2.charAt()charCodeAt()方法
      charAt()方法的功能和使用下標(biāo)對(duì)字符串中的字符進(jìn)行檢索一樣,參數(shù)填入的就是下標(biāo)感帅,如果該字符串為空斗锭,那么無論參數(shù)為幾輸出的也是'(空字符串)'
      charAt()

      charCodeAt()方法的功能是通過下標(biāo)檢索字符串中的某個(gè)字符,然后返回它的ASCII碼失球,這里要注意的是岖是“锘伲空格也有對(duì)應(yīng)的ASCII碼,而空字符串沒有:
      charCodeAt()方法

四豺撑、字符串的截取

有時(shí)候烈疚,一段字符串很長(zhǎng),而我們需要它其中的一部分聪轿,這時(shí)候就需要用到字符串截取的方法了爷肝。
用來截取字符串的方法有substr、substring陆错、slice三種灯抛。

  • substr方法
    substr()方法截取字符串,小括號(hào)內(nèi)的參數(shù)有兩個(gè)音瓷,第一個(gè)是截取開始位置对嚼,第二個(gè)是截取的長(zhǎng)度:
    如下:從第三位起截取五個(gè)字符:
    substr
  • substring方法
    substr()方法相比,substring()中的參數(shù)填入的也是兩個(gè)外莲,但是其意義卻有所不同猪半,substring()中的兩個(gè)參數(shù)第一個(gè)也是起始位置兔朦,但是第二個(gè)是結(jié)束為止偷线,并且該位并不包含在內(nèi);
    substr()相同的例子沽甥,結(jié)果卻有所不同:
    substring
  • slice方法
    slice方法與substring方法類似声邦,得到的結(jié)果也類似,但是有一點(diǎn)不同的是slice接受負(fù)參摆舟,而substring如果有負(fù)參則直接將負(fù)參轉(zhuǎn)化為0:
    slice的負(fù)參中亥曹,-1表示最后一位,-2倒數(shù)第二位恨诱,以此類推:
    對(duì)比如下:
    slice與substring的對(duì)比

五媳瞪、字符串的查找和替換

字符串的查找替換有三種方法search、replace照宝、match蛇受、indexOf / lastIndexOf,當(dāng)我們需要在一長(zhǎng)串字符串中尋找到或是替換想要的字符就需要用到它們:

  • search方法
    search()顧名思義厕鹃,就是查找兢仰,它接受一個(gè)參數(shù),該參數(shù)是你需要查找的字符剂碴,如果被查找的字符串中這個(gè)字符把将,則返回它在該字符串中的下標(biāo),如果沒有則返回-1忆矛,用法如下:


    search

    但是需要注意的是:如果字符串中有多個(gè)符合的字符察蹲,search方法只會(huì)返回第一個(gè)查找到的字符的位置
    如果想要返回每個(gè)匹配到的字符,那么可以使用match方法搭配正則表達(dá)式

  • match方法
    match()方法一般搭配正則表達(dá)式使用,支持全局匹配递览,參數(shù)是匹配的字符或正則叼屠,返回一個(gè)數(shù)組,如上例子中绞铃,我想要匹配字符串中g(shù)這個(gè)字符镜雨,可以寫一個(gè)正則/g/g來進(jìn)行匹配:

    match

  • indexOf / lastIndexOf方法
    indexOf() 和 lastIndexOf()方法分別是查找第一個(gè)要查找的字符(indexOf())和最后一個(gè)要查找的字符(lastIndexOf()),參數(shù)填入的都是要查找的字符儿捧,然后返回這個(gè)字符在字符串中的位置:


    indexOf() 和 lastIndexOf()
  • replace方法
    replace()方法用于查找并替換字符荚坞,該方法不會(huì)影響原字符串,可以填入兩個(gè)參數(shù)菲盾,第一個(gè)參數(shù)為需要被替換的字符颓影,第二個(gè)是用來替換的字符,返回替換字符后的新字符串:


    replace

    此外懒鉴,replace的參數(shù)也可以是正則表達(dá)式:


六诡挂、字符串的大小寫

操作字符串的大小寫有兩個(gè)方法toUpperCase、toLowerCase临谱;
這兩個(gè)方法都是默認(rèn)全局匹配的璃俗,用法如下:

字符串的大小寫

七、字符串轉(zhuǎn)換數(shù)組(split方法)

有時(shí)候需要對(duì)字符串進(jìn)行更加復(fù)雜的操作悉默,可以將其轉(zhuǎn)換成數(shù)組城豁,然后采用數(shù)組的操作方法來操作,這時(shí)候就需要用到字符串的split方法:
split()方法有一個(gè)參數(shù)抄课,這個(gè)參數(shù)是用來做字符串分割的參照物唱星,再按照這個(gè)參照物分割字符串后按照順序填充進(jìn)數(shù)組中,如果不填跟磨,則默認(rèn)整個(gè)字符串就是數(shù)組中的一項(xiàng):


split方法

方法總結(jié)

  • 長(zhǎng)度以及索引:
    1.length:長(zhǎng)度间聊;
    2.charAt()、charCodeAt():索引查找字符以及ASCII碼查找抵拘;
  • 查找字符:
    1.search()哎榴、indexOf() / lastIndexOf():查找字符并返回該字符在字符串中的索引,沒有則返回-1仑濒;
    2.match():匹配字符叹话,并返回匹配到的字符組成的數(shù)組,沒有則返回null墩瞳,可填入正則驼壶;
    3.replace():用來查找并替代字符,兩個(gè)參數(shù)喉酌,第一個(gè)是需要被替代的字符热凹,第二個(gè)是用來替代的字符泵喘;
  • 大小寫
    1.toUpperCase():轉(zhuǎn)換大寫,默認(rèn)全局般妙;
    2.toLowerCase():轉(zhuǎn)換小寫纪铺,默認(rèn)全局;
  • 字符串轉(zhuǎn)換數(shù)組
    split():參數(shù)是用以分割字符串的參照物碟渺,將字符轉(zhuǎn)換成數(shù)組鲜锚,之后可以使用數(shù)組的操作方法進(jìn)行操作;
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末苫拍,一起剝皮案震驚了整個(gè)濱河市芜繁,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌绒极,老刑警劉巖骏令,帶你破解...
    沈念sama閱讀 222,104評(píng)論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異垄提,居然都是意外死亡榔袋,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,816評(píng)論 3 399
  • 文/潘曉璐 我一進(jìn)店門铡俐,熙熙樓的掌柜王于貴愁眉苦臉地迎上來凰兑,“玉大人,你說我怎么就攤上這事高蜂〈侠瑁” “怎么了罕容?”我有些...
    開封第一講書人閱讀 168,697評(píng)論 0 360
  • 文/不壞的土叔 我叫張陵备恤,是天一觀的道長(zhǎng)。 經(jīng)常有香客問我锦秒,道長(zhǎng)露泊,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 59,836評(píng)論 1 298
  • 正文 為了忘掉前任旅择,我火速辦了婚禮惭笑,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘生真。我一直安慰自己沉噩,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,851評(píng)論 6 397
  • 文/花漫 我一把揭開白布柱蟀。 她就那樣靜靜地躺著川蒙,像睡著了一般。 火紅的嫁衣襯著肌膚如雪长已。 梳的紋絲不亂的頭發(fā)上畜眨,一...
    開封第一講書人閱讀 52,441評(píng)論 1 310
  • 那天昼牛,我揣著相機(jī)與錄音,去河邊找鬼康聂。 笑死贰健,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的恬汁。 我是一名探鬼主播伶椿,決...
    沈念sama閱讀 40,992評(píng)論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼氓侧!你這毒婦竟也來了悬垃?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,899評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤甘苍,失蹤者是張志新(化名)和其女友劉穎尝蠕,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體载庭,經(jīng)...
    沈念sama閱讀 46,457評(píng)論 1 318
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡看彼,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,529評(píng)論 3 341
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了囚聚。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片靖榕。...
    茶點(diǎn)故事閱讀 40,664評(píng)論 1 352
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖顽铸,靈堂內(nèi)的尸體忽然破棺而出茁计,到底是詐尸還是另有隱情,我是刑警寧澤谓松,帶...
    沈念sama閱讀 36,346評(píng)論 5 350
  • 正文 年R本政府宣布星压,位于F島的核電站,受9級(jí)特大地震影響鬼譬,放射性物質(zhì)發(fā)生泄漏娜膘。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,025評(píng)論 3 334
  • 文/蒙蒙 一优质、第九天 我趴在偏房一處隱蔽的房頂上張望竣贪。 院中可真熱鬧,春花似錦巩螃、人聲如沸演怎。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,511評(píng)論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽爷耀。三九已至,卻和暖如春淑际,著一層夾襖步出監(jiān)牢的瞬間畏纲,已是汗流浹背扇住。 一陣腳步聲響...
    開封第一講書人閱讀 33,611評(píng)論 1 272
  • 我被黑心中介騙來泰國(guó)打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留盗胀,地道東北人艘蹋。 一個(gè)月前我還...
    沈念sama閱讀 49,081評(píng)論 3 377
  • 正文 我出身青樓鹰椒,卻偏偏與公主長(zhǎng)得像挠他,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子跳仿,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,675評(píng)論 2 359

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

  • Ba la la la ~ 讀者朋友屑迂,你們好啊浸策,又到了冷鋒時(shí)間,話不多說惹盼,發(fā)車庸汗! 1、字符串轉(zhuǎn)換 var...
    王飽飽閱讀 370評(píng)論 0 3
  • js基礎(chǔ)篇(一)——數(shù)組的各種操作js基礎(chǔ)篇(三)——DOM的各種操作 1. 創(chuàng)建字符串 一個(gè)字符串用于存儲(chǔ)一系列...
    hanyuntao閱讀 898評(píng)論 0 5
  • 第5章 引用類型(返回首頁) 本章內(nèi)容 使用對(duì)象 創(chuàng)建并操作數(shù)組 理解基本的JavaScript類型 使用基本類型...
    大學(xué)一百閱讀 3,238評(píng)論 0 4
  • 2017.7.3晴 不經(jīng)意就接近訓(xùn)練尾聲了手报,有好多小伙伴堅(jiān)持下來蚯舱,有的不會(huì)知道是什么原因也有沒有堅(jiān)持的,每個(gè)人...
    fab黃菲菲閱讀 281評(píng)論 0 0
  • 挺慶幸我自己還能周期性的記起來掩蛤,在這里寫下點(diǎn)什么 最近找房子枉昏、搬家、退房揍鸟、再找房子兄裂、再搬家 稍微回想一下,跟一年前...
    采臣胸閱讀 250評(píng)論 0 1