【JS】7--字符串String

創(chuàng)建字符串2個(gè)方法:

  • 1.字面量創(chuàng)建:
let a = 'hello';  // "hello"
typeof a; // "string"
  • 2.字符串對(duì)象創(chuàng)建:
let a = new String('hello'); //String {"hello"}
typeof a; // "object"

實(shí)際開發(fā)中吵瞻,除非必要,建議使用字面量創(chuàng)建,因?yàn)閮煞N創(chuàng)建方法會(huì)有差異:

let a1 = "1+1";
let a2 = new String("1+1");
eval(a1); // number  2
eval(a2); // string  "1+1"

String有一個(gè)length屬性抓于,表示字符串中字符個(gè)數(shù):

let a = "hello";
a.length; // 5

1. String對(duì)象方法

String對(duì)象的方法非常多龙优,建議大家可以到 W3school JavaScript String 對(duì)象
asp) 學(xué)習(xí)完整的內(nèi)容羊异。

方法 描述
length 長(zhǎng)度
indexOf(char,from),lastIndexOf() 分別返回字符串中指定子串的 索引 或最后出現(xiàn)索引。未找到返-1
search() 檢索字符串中的字符串,search() 方法搜索特定值的字符串彤断,并返回匹配的位置:
slice(start,end) 從一個(gè)字符串提取片段并作為新字符串返回野舶。
substring() 類似于 slice()。不同之處在于 substring() 無法接受負(fù)的索引宰衙。
substr() 類似于 slice()平道。不同之處在于第二個(gè)參數(shù)規(guī)定被提取部分的長(zhǎng)度。
replace() 字符串替換
charAt(index), charCodeAt, codePointAt 返回字符串指定位置的字符或者字符編碼
startsWith, endsWith,includes 返回字符串是否以指定字符串開始菩浙、結(jié)束或包含指定字符串巢掺。
concat() 連接兩個(gè)字符串并返回新的字符串。
fromCharCode, fromCodePoint 從指定的Unicode值序列構(gòu)造一個(gè)字符串劲蜻。這是一個(gè)String類方法陆淀,不是實(shí)例方法。
split() 通過將字符串分離成一個(gè)個(gè)子串來把一個(gè)String對(duì)象分裂到一個(gè)字符串?dāng)?shù)組中先嬉。
substring(), substr() 分別通過指定起始和結(jié)束位置轧苫,起始位置和長(zhǎng)度來返回字符串的指定子集。
match, replace,search 通過正則表達(dá)式來工作.
toLowerCase, toUpperCase 分別返回字符串的小寫表示和大寫表示疫蔓。
normalize 按照指定的一種 Unicode 正規(guī)形式將當(dāng)前字符串正規(guī)化含懊。
repeat 將字符串內(nèi)容重復(fù)指定次數(shù)后返回。
trim 去掉字符串開頭和結(jié)尾的空白字符衅胀。

1. 字符串轉(zhuǎn)換

字符串轉(zhuǎn)換是最基礎(chǔ)的要求和工作岔乔,你可以將任何類型的數(shù)據(jù)都轉(zhuǎn)換為字符串,你可以用下面三種方法的任何一種:

var num=24;
var mystr=num.toString();    //"24"

你同樣可以這么做:

var num=24;
var mystr=String(num);    //"24"

或者滚躯,在簡(jiǎn)單點(diǎn)兒:

var num=24;
var mystr="" + num;    //"24"

2. charAt -------查找字符串位置

作用:查找字符串中指定位置內(nèi)容雏门。
str.charAt(index) index : 查找的字符的下標(biāo)(大于等于0,若小于0則返回空字符串)掸掏,若沒傳則表示1茁影。

let a = "hello leo!"
a.charAt();  // "h"
a.charAt(1); // "e"
a.charAt(-1);// ""

同樣,它的一個(gè)兄弟函數(shù)就是查找對(duì)應(yīng)位置的字符編碼值丧凤,如:

var mystr="Hello World!";
var charCode=mystr. charCodeAt(7);    //111  

3. indexOf() 和 lastIndexOf() ------字符串下標(biāo)搜索

作用:查找指定字符串位置募闲。
indexOflastIndexOf相同點(diǎn):
兩者接收的參數(shù)一致,沒有查到內(nèi)容愿待,返回-1浩螺。
indexOflastIndexOf不同點(diǎn):
若查找到內(nèi)容靴患,則indexOf返回第一次出現(xiàn)的索引lastIndexOf返回最后一次出現(xiàn)的索引

str.indexOf(value[, fromIndex])接收2個(gè)參數(shù):

  • value : 需要查找的字符串內(nèi)容年扩;
  • fromIndex : 可選蚁廓,開始查找的位置,默認(rèn)0厨幻;
let a = 'hello leo';     
let b = a.indexOf('lo');  // 3
let c = a.indexOf('lo',4);// -1
let e = a.lastIndexOf('l');  // 6

一定要注意:

  1. 當(dāng)fromIndex > a.length相嵌,則fromIndex被視為a.length
let a = 'hello leo';  
let b = a.indexOf('lo',99);// -1
  1. 當(dāng)fromIndex < 0况脆,則fromIndex被視為0饭宾。
let a = 'hello leo';  
let b = a.indexOf('lo',-1);// 3
  1. indexOflastIndexOf區(qū)分大小寫。
let a = 'hello leo'; 
let b = a.indexOf('Lo'); // -1

4. concat() ------------ 字符串拼接

作用:連接字符串格了。

  • concat()接收任意個(gè)參數(shù)作為連接的字符串看铆,返回一個(gè)合并后的新字符串。
  • concat()函數(shù)可以有多個(gè)參數(shù)盛末,傳遞多個(gè)字符串弹惦,拼接多個(gè)字符串。
let a = 'hello';
let b = ' leo ';
let c = '!'
a.concat(b,c); // "hello leo !"

5. split ()--------字符串分割

作用:把字符串分割為字符串?dāng)?shù)組悄但,并可以指定分隔符棠隐。
split(separator[,limit])可以接收2個(gè)參數(shù):

  • separator:必需,字符串或者正則表達(dá)式檐嚣,作為分割的內(nèi)容助泽;
  • limit:可選,作為指定返回的數(shù)組的最大長(zhǎng)度嚎京;

separator""嗡贺,則字符串會(huì)在每個(gè)字符之間分割;

let a = 'How are you doing today?';
a.split();
// ["How are you doing today?"]
a.split("");
// ["H", "o", "w", " ", "a", "r", "e", " ", "y", "o", "u", " ", "d", "o", "i", "n", "g", " ", "t", "o", "d", "a", "y", "?"]
a.split(" ");
// ["How", "are", "you", "doing", "today?"]
a.split("",4);
// ["H", "o", "w", " "]
a.split(" ",4);
// ["How", "are", "you", "doing"]

使用其他分割符號(hào):

let a = "ni,hao,a!";
a.split(","); // ["ni", "hao", "a!"]

6. slice

作用:提取并返回字符串的片斷鞍帝。
slice([start,end]) 可以接收2個(gè)參數(shù):

  • start:要提取的片段的起始下標(biāo)诫睬,若小于零,則從字符串尾部開始算起帕涌,如-1表示字符串最后一個(gè)字符岩臣,-2為倒數(shù)第二個(gè)字符等等。
  • end:要提取的片段的結(jié)束下標(biāo)宵膨,若沒有傳入,則表示從start到字符串結(jié)尾炸宵,若為負(fù)數(shù)則從字符串尾部開始算起辟躏。
let a = 'How are you doing today?';
a.slice();      // "How are you doing today?"
a.slice(1);     // "ow are you doing today?"
a.slice(-1);    // '?'
a.slice(1,5);   // "ow a"
a.slice(1,-1);  // "ow are you doing today"
a.slice(-2,-1); // "y"

7. substring() substr() slice()

有三種可以從字符串中抽取和切割的方法:
第一種:substring()函數(shù):

var mystr="hello world!";
var sliceStr1=mystr.substring(3);    //lo world!
var sliceStr2=mystr.substring(3,7);    //lo w    從3開始,結(jié)束位置7

第二種:substr()函數(shù):

var mystr="hello world!";
var sliceStr1=mystr.substr(3);    //lo world!
var sliceStr2=mystr.substr(3,7);    //lo wo    從3開始土全,長(zhǎng)度為7

第三種捎琐,slice()函數(shù):

var mystr="hello world!";
var sliceStr1=mystr.slice(-3);    //ld!
var sliceStr2=mystr.slice(-3,-1);    //ld
var sliceStr3=mystr.slice(3);    //lo world!
var sliceStr4=mystr.slice(3,7);    //lo w

注:
1.slice() 可以為負(fù)數(shù)会涎,如果起始位置為負(fù)數(shù),則從字符串最后一位向前找對(duì)應(yīng)位數(shù)并且向后取結(jié)束位置瑞凑,如果為正整數(shù)則從前往后取起始位置到結(jié)束位置末秃。
2.substring()只能非負(fù)整數(shù),截取起始結(jié)束位置同slice()函數(shù)一致籽御。
3.substr()與第一练慕、第二種函數(shù)不同,從起始位置開始截取技掏,結(jié)束位置為第二個(gè)參數(shù)截取的字符串最大長(zhǎng)度铃将。
以上三種函數(shù)未填第二參數(shù)時(shí),自動(dòng)截取起始位置到字符串末尾劲阎。

8. replace()字符串替換

僅僅查找到字符串并不會(huì)是題目的停止,一般題目還經(jīng)常會(huì)要求你去進(jìn)行替換操作鸠真,那就繼續(xù)看以下代碼:

var mystr="我愛我的祖國(guó),我的祖國(guó)也愛我";  
var replaceStr=mystr.replace("祖國(guó)"," ");    //我愛我的 锡垄,我的 也愛我
var replaceStr=mystr.replace(/祖國(guó)/g,"國(guó)家 ");    //我愛我的國(guó)家,我的國(guó)家也愛我

默認(rèn)只進(jìn)行第一次匹配操作的替換偎捎,想要全局替換,需要置上正則全局標(biāo)識(shí)g

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

獲取字符串的長(zhǎng)度經(jīng)常會(huì)用到茴她,方法很簡(jiǎn)單:

var mystr="qingchenghuwoguoxiansheng,woaishenghuo,woaiziji";
var arrLength=mystr.length;    //47  

10、trim() 字符串去空格

trim()方法用來刪除字符串前后的空格

var mystr="     hello world      ";  
var trimStr=mystr.trim();    //hello world

常用的字符串操作

1丈牢、字符串去重

var str="aahhgggsssjjj";
function removeRepeat(msg){  
    var res=[];  
    var arr=msg.split("");  
    for(var i=0;i<arr.length;i++){  
        if(res.indexOf(arr[i])==-1){  
            res.push(arr[i]);  
        }  
    }  
    return res.join("");  
}  
removeRepeat(str);    //ahgsj

2、判斷字符串中字符出現(xiàn)的次數(shù)

 1.先實(shí)現(xiàn)字符串去重  
 2.然后對(duì)去重后的數(shù)組用for循環(huán)操作己沛,分別與原始數(shù)組中各個(gè)值進(jìn)行比較,如果相等則count++,循環(huán)結(jié)束將count保存在sum數(shù)組中申尼,然后將count重置為0  
 3.這樣一來去重后的數(shù)組中的元素在原數(shù)組中出現(xiàn)的次數(shù)與sum數(shù)組中的元素是一一對(duì)應(yīng)的  
var str="aacccbbeeeddd";  
var sum=[];  
var res=[];  
var count=0;  
var arr=str.split("");  
for(var i=0;i<arr.length;i++){  
    if(res.indexOf(arr[i])==-1){  
        res.push(arr[i]);  
    }  
}  
for(var i=0;i<res.length;i++){  
    for(var j=0;j<arr.length;j++){  
        if(arr[j]==res[i]){  
            count++;  
        }  
    }  
    sum.push(count);  
    count=0;  
}  
console.log(res);    //["a", "c", "b", "e", "d"]  
for(var i=0;i<res.length;i++){  
    var str=(sum[i]%2==0)?"
    console.log(res[i]+"
    console.log(res[i]+"
}  

PS:若對(duì)字符串學(xué)習(xí)還是不夠透徹,請(qǐng)查閱W3C

http://www.w3school.com.cn/jsref/jsref_obj_string.asp
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String

2.字符串拓展(ES6)

2.1 includes(),startsWith(),endsWith()

在我們判斷字符串是否包含另一個(gè)字符串時(shí)垫桂,ES6之前师幕,我們只有typeof方法,ES6之后我們又多了三種方法:

  • includes():返回布爾值诬滩,表示是否找到參數(shù)字符串霹粥。
  • startsWith():返回布爾值灭将,表示參數(shù)字符串是否在原字符串的頭部
  • endsWith():返回布爾值后控,表示參數(shù)字符串是否在原字符串的尾部庙曙。
let a = 'hello leo';
a.startsWith('leo');   // false
a.endsWith('o');       // true
a.includes('lo');      // true

并且這三個(gè)方法都支持第二個(gè)參數(shù),表示起始搜索的位置浩淘。

let a = 'hello leo';
a.startsWith('leo',1);   // false
a.endsWith('o',5);       // true
a.includes('lo',6);      // false

endsWith 是針對(duì)前 n 個(gè)字符捌朴,而其他兩個(gè)是針對(duì)從第n個(gè)位置直到結(jié)束。

2.2 repeat()

repeat方法返回一個(gè)新字符串馋袜,表示將原字符串重復(fù)n次男旗。
基礎(chǔ)用法

'ab'.repeat(3);        // 'ababab'
'ab'.repeat(0);        // ''

特殊用法:

  • 參數(shù)為小數(shù),則取整
'ab'.repeat(2.3);      // 'abab'

  • 參數(shù)為負(fù)數(shù)Infinity欣鳖,則報(bào)錯(cuò)
'ab'.repeat(-1);       // RangeError
'ab'.repeat(Infinity); // RangeError

  • 參數(shù)為0到-1的小數(shù)NaN察皇,則取0
'ab'.repeat(-0.5);     // ''
'ab'.repeat(NaN);      // ''

  • 參數(shù)為字符串,則轉(zhuǎn)成數(shù)字
'ab'.repeat('ab');     // ''
'ab'.repeat('3');      // 'ababab'

2.3 padStart(),padEnd()

用于將字符串頭部尾部補(bǔ)全長(zhǎng)度泽台,padStart()頭部補(bǔ)全什荣,padEnd()尾部補(bǔ)全
這兩個(gè)方法接收2個(gè)參數(shù)怀酷,第一個(gè)指定字符串最小長(zhǎng)度稻爬,第二個(gè)用于補(bǔ)全的字符串
基礎(chǔ)用法

'x'.padStart(5, 'ab');   // 'ababx'
'x'.padEnd(5, 'ab');     // 'xabab'

特殊用法:

  • 原字符串長(zhǎng)度蜕依,大于或等于指定最小長(zhǎng)度桅锄,則返回原字符串。
'xyzabc'.padStart(5, 'ab'); // 'xyzabc'

  • 用來補(bǔ)全的字符串長(zhǎng)度和原字符串長(zhǎng)度之和样眠,超過指定最小長(zhǎng)度友瘤,則截去超出部分的補(bǔ)全字符串。
'ab'.padStart(5,'012345'); // "012ab"

  • 省略第二個(gè)參數(shù)檐束,則用空格補(bǔ)全辫秧。
'x'.padStart(4);           // '    x'
'x'.padEnd(4);             // 'x    '

2.4 模版字符串

用于拼接字符串,ES6之前:

let a = 'abc' + 
    'def' + 
    'ghi';

ES6之后:

let a = `
    abc
    def
    ghi
`

拼接變量: 在**反引號(hào)()**中使用${}`包裹變量或方法被丧。

// ES6之前
let a = 'abc' + v1 + 'def';

// ES6之后
let a = `abc${v1}def`

3.字符串拓展(ES7)

用來為字符串填充特定字符串,并且都有兩個(gè)參數(shù):字符串目標(biāo)長(zhǎng)度填充字段柿究,第二個(gè)參數(shù)可選黄选,默認(rèn)空格。

'es8'.padStart(2);          // 'es8'
'es8'.padStart(5);          // '  es8'
'es8'.padStart(6, 'woof');  // 'wooes8'
'es8'.padStart(14, 'wow');  // 'wowwowwowwoes8'
'es8'.padStart(7, '0');     // '0000es8'

'es8'.padEnd(2);            // 'es8'
'es8'.padEnd(5);            // 'es8  '
'es8'.padEnd(6, 'woof');    // 'es8woo'
'es8'.padEnd(14, 'wow');    // 'es8wowwowwowwo'
'es8'.padEnd(7, '6');       // 'es86666'

從上面結(jié)果來看,填充函數(shù)只有在字符長(zhǎng)度小于目標(biāo)長(zhǎng)度時(shí)才有效懂诗,若字符長(zhǎng)度已經(jīng)等于或小于目標(biāo)長(zhǎng)度時(shí)殃恒,填充字符不會(huì)起作用,而且目標(biāo)長(zhǎng)度如果小于字符串本身長(zhǎng)度時(shí)病附,字符串也不會(huì)做截?cái)嗵幚硗昊Γ粫?huì)原樣輸出。

參考資料

  1. MDN Text formatting
  2. W3school JavaScript String 對(duì)象
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末覆积,一起剝皮案震驚了整個(gè)濱河市宽档,隨后出現(xiàn)的幾起案子吗冤,更是在濱河造成了極大的恐慌九府,老刑警劉巖昔逗,帶你破解...
    沈念sama閱讀 222,865評(píng)論 6 518
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件勾怒,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡段只,警方通過查閱死者的電腦和手機(jī)赞枕,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,296評(píng)論 3 399
  • 文/潘曉璐 我一進(jìn)店門炕婶,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人项滑,你說我怎么就攤上這事枪狂∷斡妫” “怎么了?”我有些...
    開封第一講書人閱讀 169,631評(píng)論 0 364
  • 文/不壞的土叔 我叫張陵严蓖,是天一觀的道長(zhǎng)谈飒。 經(jīng)常有香客問我杭措,道長(zhǎng)钾恢,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 60,199評(píng)論 1 300
  • 正文 為了忘掉前任泉懦,我火速辦了婚禮崩哩,結(jié)果婚禮上邓嘹,老公的妹妹穿的比我還像新娘险胰。我一直安慰自己,他們只是感情好棚贾,可當(dāng)我...
    茶點(diǎn)故事閱讀 69,196評(píng)論 6 398
  • 文/花漫 我一把揭開白布妙痹。 她就那樣靜靜地躺著,像睡著了一般沛贪。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上水评,一...
    開封第一講書人閱讀 52,793評(píng)論 1 314
  • 那天中燥,我揣著相機(jī)與錄音,去河邊找鬼拿霉。 笑死绽淘,一個(gè)胖子當(dāng)著我的面吹牛闹伪,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播杀怠,決...
    沈念sama閱讀 41,221評(píng)論 3 423
  • 文/蒼蘭香墨 我猛地睜開眼赔退,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼证舟!你這毒婦竟也來了褪储?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 40,174評(píng)論 0 277
  • 序言:老撾萬榮一對(duì)情侶失蹤浪读,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后互订,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體痘拆,經(jīng)...
    沈念sama閱讀 46,699評(píng)論 1 320
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡纺蛆,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,770評(píng)論 3 343
  • 正文 我和宋清朗相戀三年桥氏,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片字支。...
    茶點(diǎn)故事閱讀 40,918評(píng)論 1 353
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡堕伪,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出蹄梢,到底是詐尸還是另有隱情富俄,我是刑警寧澤蛙酪,帶...
    沈念sama閱讀 36,573評(píng)論 5 351
  • 正文 年R本政府宣布桂塞,位于F島的核電站,受9級(jí)特大地震影響玛痊,放射性物質(zhì)發(fā)生泄漏狂打。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,255評(píng)論 3 336
  • 文/蒙蒙 一对省、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧哀托,春花似錦劳秋、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,749評(píng)論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至驰弄,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間五鲫,已是汗流浹背岔擂。 一陣腳步聲響...
    開封第一講書人閱讀 33,862評(píng)論 1 274
  • 我被黑心中介騙來泰國(guó)打工乱灵, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人规婆。 一個(gè)月前我還...
    沈念sama閱讀 49,364評(píng)論 3 379
  • 正文 我出身青樓抒蚜,卻偏偏與公主長(zhǎng)得像耘戚,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子饿这,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,926評(píng)論 2 361

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