在上篇文章給大家介紹了javascriptRegex和字串RegExp and String(一),本文給大家繼續分享相關內容。
前言
我認為,在學習一門程式設計語言的過程中,字串、數組、容器是非常重要的部分,為了提高編程效率,我通常會對字串、數組以及容器作深入的學習,詳細瞭解相關特點及對應的API。這篇文章是針對javascript字串學習寫下的筆記,在此與需要的朋友分享。
思維導圖
字串的建立方式
字串是javascript中的基本類型之一,它對應的類型是String,可以通過兩種方式來建立字串:
通過變數賦值的方式, 建立字串的基本類型
通過構造方法(String),建立字串對象
雖然兩種方式建立出的字串表現形式不一樣,但在某些情境下,我們需要的是字串,但不關心它是字串基本類型還是字串對象。在這種情境下,字串的判斷就會發生了一點小小的變化。
具體可參照下面代碼加深理解:
var s = 'abcd1234DCBA'; //推薦的建立字串方式var s1 = 'abcd1234DCBA';var s2 = new String(s); // 通過構造方法建立字串var s3 = new String(s);console.log(s===s1); //true 具有實值型別的特性console.log(s===s2); //false 基本類型和對象不相等console.log(s2===s3); //false 不同的對象不相等console.log(typeof s); // stringconsole.log(typeof s2); // object//判斷輸入值是否是基本類型字串function isString(s) { return typeof s === 'string'}console.log(isString(s)); //trueconsole.log(isString(s2)); //false//判斷輸入值是否是字串(基本類型+字串對象形式)function isString2(s) { return s != null && typeof s.valueOf() === 'string';}console.log(isString2(s)); //trueconsole.log(isString2(s2)); //true
字串的值不變特性
字串在Javascript中是不可變的。所謂的不可變是指當你產生一個字串後,然後調用該字串的API來操作該字串,該字串的原始值是不會發生變化的,調用處理後的結果是一個新的字串。
可參照下面代碼加深理解:
var s = new String('abc'); var r = s.toUpperCase(); alert(s); // abc s本身是不會發生變化的 alert(r); // ABC
常用API - 字串截取
不關於字串的截取,掌握下面三個API即可:
slice : String.slice(N1,N2) 這個就是我們常用的從指定的位置(N1)到指定的位置(N2)的字串;
substring : String.substring(N1,N2) 這個就是我們常用的從指定的位置(N1)到指定的位置(N2)的字串;
substr : String.substr(N1,N2) 這個就是我們常用的從指定的位置(N1)截取指定長度(N2)的字串;
可參考下面代碼加深理解:
var s = '0123456789';
var r1 = s.substring(1); //123456789 第二個參數預設為字元length
var r2 = s.substring(1,5); //1234
var r3 = s.substring(1); //123456789 第二個參數預設為字元length
var r4 = s.substring(1,5); //1234
var r5 = s.substr(1); //123456789 第二個參數預設為字元length
var r6 = s.substr(2,5); //23456
var r7 = s.substr(2,100); //23456789 第二個參數大於字元length,不受影響
常用API - 字串檢索
關於字串的檢索操作,掌握下面三個API即可。字串檢索在其它程式設計語言中很常見,indexOf以及lastIndexOf這兩個API子啊其它程式設計語言中非常常見,理解起來也相對容易。關於search,和indexOf類似,只是它的輸入參數不是檢索的字串,而是一個Regex, 傳回值為Regex第一個匹配項的索引。
具體可參考下面代碼加深理解:
var s = '0123abc401234';console.log(s.indexOf('23')); // 2console.log(s.lastIndexOf('23')); // 10console.log(s.search(/[a-z]+/g)); // 4 檢索出現字元的開始位置
常用API - 字串替換
JS中一般調用replace方法來對字串中某些字元的替換,該方法接收兩個參數:
* 第一個參數是用來描述要被替換的子字串,參數類型可以是字串也可以是Regex。這裡千萬要注意,如果是字串,則只會替換原字串中第一個匹配的子串,而如果是未設定標識'g'的Regex,替換時得出的結果也是一樣的,如果想替換所有匹配的子字串,則必須傳入帶有標識g的Regex
* 第二個參數是用來描述替換值。參數類型可以是一個字串,也可以是一個函數,還可以是包含特殊序列字元(RegExp的靜態屬性:−/&/‘/'/1..n/$$等)。
具體可參照下面代碼加深理解:
代碼一. 基本匹配操作
var s = 'cat,bat,sat,fat';var res = s.replace('at','NE');console.log(res);//cNE,bat,sat,fat 只替換第一個匹配項var res1 = s.replace(/at/,'NE');console.log(res1); //cNE,bat,sat,fat 還是只替換第一個匹配項var res2 = s.replace(/at/g,'NE');console.log(res2); //cNE,bNE,sNE,fNE 替換所有的匹配項
代碼二 . 第二個參數是函數
var s = 'ab<name>cd';// 類比HTML對符合 < >進行轉義var res = s.replace(/[<>]/g,function(match,index,souStr) { switch(match) { case '<': return '<'; case '>': return '>'; }});console.log(res); // ab<name>cd
代碼三. 才有特殊序列字元進行靈活替換
// 針對字元sou,將關鍵字key用{}擴起來function strong(sou,key) { var re = new RegExp('('+key+')','g'); return sou.replace(re,'{$1}'); //$1 第一個擷取的群組}console.log(strong(s,'at')); //c{at},b{at},s{at},f{at}// 針對字元sou,將關鍵字key用{}擴起來 function strong2(sou,key) { var re = new RegExp(key,'g'); return sou.replace(re,'{$&}'); //$& 匹配的字串 }console.log(strong2(s,'at')); //c{at},b{at},s{at},f{at}
常用API - 字串分組
JS中採用split方法來對字串進行分組,該方法可接收兩個參數:
* 第一個參數表示分隔字元,可以是字串類型,也可以是RegExp對象。
* 第二個參數是可選的,表示接收組的數量,也就是返回結果數組的大 小。如果不指定該參數,表示返回所有組。
具體可參照下面代碼加深理解:
var s = 'cat,bat,sat,fat';var res = s.split(',');console.log(res); //[ 'cat', 'bat', 'sat', 'fat' ]var res2 = s.split(/,/);console.log(res2); //[ 'cat', 'bat', 'sat', 'fat' ]var res3 = s.split(/,/,2);console.log(res3); //[ 'cat', 'bat' ] 只返回2組
常用API - 字串匹配
match() 方法將檢索字串 stringObject,以找到一個或多個與 regexp 匹配的文本。這個方法的行為在很大程度上有賴於 regexp 是否具有標誌 g。
如果 regexp 沒有標誌 g,那麼 match() 方法就只能在 stringObject 中執行一次匹配。如果沒有找到任何匹配的文本, match() 將返回 null。否則,它將返回一個數組,其中存放了與它找到的匹配文本有關的資訊。該數組的第 0 個元素存放的是匹配文本,而其餘的元素存放的是與Regex的子運算式匹配的文本。除了這些常規的數組元素之外,返回的數組還含有兩個對象屬性。index 屬性聲明的是匹配文本的起始字元在 stringObject 中的位置,input 屬性聲明的是對 stringObject 的引用。
如果 regexp 具有標誌 g,則 match() 方法將執行全域檢索,找到 stringObject 中的所有匹配子字串。若沒有找到任何匹配的子串,則返回 null。如果找到了一個或多個匹配子串,則返回一個數組。不過全域匹配返回的數組的內容與前者大不相同,它的數組元素中存放的是 stringObject 中所有的匹配子串,而且也沒有 index 屬性或 input 屬性。
注意:在全域檢索模式下,match() 即不提供與子運算式匹配的文本的資訊,也不聲明每個匹配子串的位置。如果您需要這些全域檢索的資訊,可以使用 RegExp.exec()。
具體可以參照下面代碼加深理解:
var s = 'cat,bat,sat,fat'; var reg = /[a-z](at)/ ;console.log(s.match(reg)); //[ 'cat', 'at', index: 0, input: 'cat,bat,sat,fat' ]var res = s.match(/[a-z](at)/g);console.log(res); //[ 'cat', 'bat', 'sat', 'fat' ]
常用API - 字串比較
兩種比較方式,一種是才有 大於或小於符號,另一種是採用localeCompare方法,注意該方法的返回的是一個數字,數位含義與其它程式設計語言比較結果類似,不作過多解釋了。牽涉的地區相關,推薦使用localeCompare來對字串進行比較。
具體可參照下面代碼加深理解:
var s1 = 'abc';var s2 = 'bcd';var s3 = new String('abc');console.log(s1>s2); //trueconsole.log(s1==s3); //true 將s1與s3.toString()進行比較console.log(s1.localeCompare(s2)); // -1 s1 小於 s2console.log(s1.localeCompare(s3)); // 0 s1的值與s3相等
以上內容就是本文給大家分享的javascriptRegex和字串RegExp and String(二),希望大家喜歡。